plain design alternatives to decouple framework and design with RightBar as example

RightBarCheckbox.css

#t3-frontend-editing__right-bar + .t3-frontend-editing__right-bar {
    transition: right 0.2s linear;
}

#t3-frontend-editing__right-bar:checked + .t3-frontend-editing__right-bar {
    right: 0;
}

#t3-frontend-editing__right-bar--open:checked + .t3-frontend-editing__right-bar .top-right-title .right-bar-button {
    left: 0;
}

.accordion-collapse-controll:checked ~ .accordion-content {
    display: block;
}

.accordion-collapse-controll:checked ~ .accordion .icon-icons-arrow-down:before {
    content: "\e90f";
}

RightBarCheckbox.html

<input type="checkbox" id="t3-frontend-editing__right-bar--open"/>
<div class="t3-frontend-editing__right-bar">
    <div class="top-right-bar-wrapper ">
        <div class="top-right-relative">
            <div class="top-right-title">
                <label for="t3-frontend-editing__right-bar--open"
                       class="right-bar-button icons icon-icons-arrow-double"
                       title="TOOLS &amp; PROPERTIES"></label>
                <span class="title-right">
					TOOLS &amp; PROPERTIES
				</span>
                <span class="title-icon-right icons icon-icons-tools-settings"></span>
            </div>

            <div class="devices hidden-elements">
                <div class="media-devices-wrapper">
                    <div class="media-devices">
                        <span class="media-device-lg-desktop icons icon-icons-lg-desktop active"
                              data-width="100%" data-height="100%"></span>
                        <span class="media-device-desktop icons icon-icons-desktop"
                              data-width="1280px" data-height="100%"></span>
                        <span class="media-device-tablet icons icon-icons-tablet"
                              data-width="960px" data-height="100%"></span>
                        <span class="media-device-phone icons icon-icons-phone"
                              data-width="640px" data-height="100%"></span>
                    </div>
                </div>
                <div class="hidden-elements-toggle-wrapper">
                    <button class="hidden-elements-toggle-button t3-frontend-editing__show-hidden-items"
                            title="Hidden elements"
                            data-url="http://t3-test.lndo.site:8000/?&amp;show_hidden_items=0&amp;show_hidden_items=1&amp;frontend_editing=true&amp;no_cache=1&amp;show_hidden_items=1">
                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 300 300" xml:space="preserve" class="hidden-elements-toggle-icon" width="48" height="48">
<g>
	<path class="eye" d="M201.3,149.8c0,0,0-0.1,0-0.1c0,0,0,0,0-0.1c0,0,0-0.1,0-0.1c0,0,0-0.1,0-0.1c0,0,0,0,0,0c-0.1-0.8-0.5-1.5-1.1-2.1   c-3.2-3.8-7-7.2-10.9-10.3c-8.4-6.7-17.9-12.2-28.5-14.5c-6.1-1.3-12.2-1.4-18.4-0.3c-5.6,1-11,3.1-16,5.6   c-7.9,4-15.1,9.6-21.3,15.8c-1.2,1.2-2.3,2.3-3.4,3.6c-1.4,1.7-1.4,3.6,0,5.3c3.2,3.8,7,7.2,10.9,10.3c8.4,6.7,17.9,12.2,28.5,14.5   c6.1,1.3,12.2,1.4,18.4,0.3c5.6-1,11-3.1,16-5.6c7.9-4,15.1-9.6,21.3-15.8c1.2-1.2,2.3-2.3,3.4-3.6c0.6-0.6,0.9-1.3,1.1-2.1   c0,0,0,0,0,0c0,0,0-0.1,0-0.1c0,0,0-0.1,0-0.1c0,0,0,0,0-0.1c0,0,0-0.1,0-0.1c0-0.1,0-0.1,0-0.2S201.3,149.9,201.3,149.8z    M151,169.4c-10.7,0-19.4-8.7-19.4-19.4c0-10.7,8.7-19.4,19.4-19.4s19.4,8.7,19.4,19.4S161.7,169.4,151,169.4z"></path>
</g>
<circle class="eye-pupil" cx="151" cy="150" r="6.4"></circle>
<g class="eye-border">
	<g>
		<path d="M242.3,246.3h-11v-10h6v-6h10v11C247.3,244.1,245.1,246.3,242.3,246.3z"></path>
	</g>
	<g>
		<path d="M208.4,246.3h-22.9v-10h22.9V246.3z M162.5,246.3h-22.9v-10h22.9V246.3z M116.6,246.3H93.7v-10h22.9V246.3z"></path>
	</g>
	<g>
		<path d="M70.7,246.3h-11c-2.8,0-5-2.2-5-5v-11h10v6h6V246.3z"></path>
	</g>
	<g>
		<path d="M64.7,207.3h-10v-22.9h10V207.3z M64.7,161.5h-10v-22.9h10V161.5z M64.7,115.6h-10V92.7h10V115.6z"></path>
	</g>
	<g>
		<path d="M64.7,69.7h-10v-11c0-2.8,2.2-5,5-5h11v10h-6V69.7z"></path>
	</g>
	<g>
		<path d="M208.4,63.7h-22.9v-10h22.9V63.7z M162.5,63.7h-22.9v-10h22.9V63.7z M116.6,63.7H93.7v-10h22.9V63.7z"></path>
	</g>
	<g>
		<path d="M247.3,69.7h-10v-6h-6v-10h11c2.8,0,5,2.2,5,5V69.7z"></path>
	</g>
	<g>
		<path d="M247.3,207.3h-10v-22.9h10V207.3z M247.3,161.5h-10v-22.9h10V161.5z M247.3,115.6h-10V92.7h10V115.6z"></path>
	</g>
</g>
</svg>
                    </button>
                </div>
            </div>
        </div>
        <div class="elements-wrapper">
            <div class="elements">


                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="common">
                    <input type="checkbox" id="checkCollapseCE" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Typical page content</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseCE" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=header&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Header Only' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-header"
                                  data-identifier="content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-header"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Header Only</span>
                                <span class="title-default title-normal-casing">Adds a header only.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=text&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Regular Text Element' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-text"
                                  data-identifier="content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-text"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Regular Text Element</span>
                                <span class="title-default title-normal-casing">A regular text element with header and bodytext fields.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=textpic&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Text &amp; Images' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-textpic"
                                  data-identifier="content-textpic">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-textpic"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Text &amp; Images</span>
                                <span class="title-default title-normal-casing">Any number of images wrapped right around a regular text element.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=image&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Images Only' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-image"
                                  data-identifier="content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-image"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Images Only</span>
                                <span class="title-default title-normal-casing">Any number of images aligned in columns and rows with a caption.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=textmedia&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Text &amp; Media' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-textmedia"
                                  data-identifier="content-textmedia">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-textmedia"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Text &amp; Media</span>
                                <span class="title-default title-normal-casing">Any number of media wrapped right around a regular text element.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=bullets&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Bullet List' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-bullets"
                                  data-identifier="content-bullets">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-bullets"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Bullet List</span>
                                <span class="title-default title-normal-casing">A single bullet list.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=table&amp;defVals[tt_content][tx_gridelements_columns]=0&amp;defVals[tt_content][bodytext]="
                             title="Drag and drop on page to create a new 'Table' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-table"
                                  data-identifier="content-table">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-table"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Table</span>
                                <span class="title-default title-normal-casing">A simple table.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=uploads&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'File Links' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-uploads"
                                  data-identifier="content-special-uploads">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-uploads"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">File Links</span>
                                <span class="title-default title-normal-casing">Makes a list of files for download.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=card_card&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Card' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_card_card"
                                  data-identifier="tx_card_card">
	<span class="icon-markup">
<span class="icon-unify"><i class="fa fa-align-center"></i></span>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Card</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=card_jselement&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'js element' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_card_jselement"
                                  data-identifier="tx_card_jselement">
	<span class="icon-markup">
<img src="/typo3conf/ext/card/Resources/Public/Icons/Content/jselement.png"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">js element</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=multicolumn&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Multicolumn Container' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx-multicolumn-wizard-icon"
                                  data-identifier="tx-multicolumn-wizard-icon">
	<span class="icon-markup">
<img src="/typo3conf/ext/multicolumn/Resources/Public/Icons/multicolumn.gif"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Multicolumn Container</span>
                                <span class="title-default title-normal-casing">This content element allows you to create dynamic columns.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=mymaskexport_simple_text&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Simple_Text' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_mymaskexport_simple_text"
                                  data-identifier="tx_mymaskexport_simple_text">
	<span class="icon-markup">
<span class="icon-unify"><i class="fa fa-angellist"></i></span>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Simple_Text</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="forms">
                    <input type="checkbox" id="checkCollapseFormElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Form elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseFormElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=form_formframework&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Form' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-form"
                                  data-identifier="content-form">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-form"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Form</span>
                                <span class="title-default title-normal-casing">A form that allows website users to submit messages.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=felogin_login&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Login Form' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-elements-login"
                                  data-identifier="content-elements-login">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-elements-login"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Login Form</span>
                                <span class="title-default title-normal-casing">Login/logout form used to password protect pages allowing only authorised website users and groups access.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="menu">
                    <input type="checkbox" id="checkCollapseMenu" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Menu</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseMenu" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_abstract&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Abstracts' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-abstract"
                                  data-identifier="content-menu-abstract">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-abstract"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Abstracts</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages including abstracts</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_categorized_content&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Categorized content' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-categorized"
                                  data-identifier="content-menu-categorized">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-categorized"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Categorized content</span>
                                <span class="title-default title-normal-casing">Content elements for selected categories</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_categorized_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Categorized pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-categorized"
                                  data-identifier="content-menu-categorized">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-categorized"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Categorized pages</span>
                                <span class="title-default title-normal-casing">Pages for selected categories</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-pages"
                                  data-identifier="content-menu-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Pages</span>
                                <span class="title-default title-normal-casing">Menu of selected pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_subpages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Subpages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-pages"
                                  data-identifier="content-menu-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Subpages</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_recently_updated&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Recently updated pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-recently-updated"
                                  data-identifier="content-menu-recently-updated">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-recently-updated"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Recently updated pages</span>
                                <span class="title-default title-normal-casing">Menu of recently updated pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_related_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Related pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-related"
                                  data-identifier="content-menu-related">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-related"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Related pages</span>
                                <span class="title-default title-normal-casing">Menu of related pages based on keywords</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_section&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Section index' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-section"
                                  data-identifier="content-menu-section">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-section"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Section index</span>
                                <span class="title-default title-normal-casing">Page content marked for section menus</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_section_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Section index of subpages from selected pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-section"
                                  data-identifier="content-menu-section">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-section"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Section index of subpages from selected pages</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages including sections</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_sitemap&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Sitemap' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-sitemap"
                                  data-identifier="content-menu-sitemap">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-sitemap"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Sitemap</span>
                                <span class="title-default title-normal-casing">Expanded menu of all subpages of the current site</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_sitemap_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Sitemaps of selected pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-sitemap-pages"
                                  data-identifier="content-menu-sitemap-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-sitemap-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Sitemaps of selected pages</span>
                                <span class="title-default title-normal-casing">Expanded menu of all subpages for selected pages</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="plugins">
                    <input type="checkbox" id="checkCollapsePlugins" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Plugins</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapsePlugins" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=list&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'General Plugin' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-plugin"
                                  data-identifier="content-plugin">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-plugin"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">General Plugin</span>
                                <span class="title-default title-normal-casing">Select this element type to insert a plugin which cannot be found amongst the options below.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="special">
                    <input type="checkbox" id="checkCollapseSpecialElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Special elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseSpecialElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=html&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Plain HTML' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-html"
                                  data-identifier="content-special-html">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-html"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Plain HTML</span>
                                <span class="title-default title-normal-casing">With this element you can insert raw HTML code on the page.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=div&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Divider' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-div"
                                  data-identifier="content-special-div">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-div"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Divider</span>
                                <span class="title-default title-normal-casing">This element inserts a visual divider, which is by default a horizontal line.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=shortcut&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Insert records' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-shortcut"
                                  data-identifier="content-special-shortcut">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-shortcut"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Insert records</span>
                                <span class="title-default title-normal-casing">With this element you can embed other content elements.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="gridelements">
                    <input type="checkbox" id="checkCollapseGridElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Grid Elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseGridElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=gridelements_pi1&amp;defVals[tt_content][tx_gridelements_backend_layout]=1&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Test' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                                  data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Test</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=gridelements_pi1&amp;defVals[tt_content][tx_gridelements_backend_layout]=2&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Grid Element Backend Layout' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                                  data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Grid Element Backend Layout</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                    </div>
                </div>


            </div>
            <div class="elements">


                <div class="content-element-hierarchy-tab dark-transparent-bg accordion-container accordion-list"
                     data-wizard-type="ce-hierarchy-elements">
                    <input type="checkbox" id="checkCollapseElementOnPage" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion ">
                        <div class="element-title">
                            <span class="title-left">Elements on page</span>
                        </div>
                        <div class="element-action">
                            <label for="checkCollapseElementOnPage" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="60">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Kopfzeile h 2</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="58">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text-media"
                          data-identifier="mimetypes-x-content-text-media">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text-media"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						09-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="50">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-image"
                          data-identifier="mimetypes-x-content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-image"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Unsaved Header</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="51">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text-picture"
                          data-identifier="mimetypes-x-content-text-picture">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text-picture"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Text</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="61">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="54">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-header"
                          data-identifier="mimetypes-x-content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-header"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">dddddddd &nbsp;dd</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="47">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-image"
                          data-identifier="mimetypes-x-content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-image"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="46">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">no comment</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="44">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">And another Header</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="62">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="52">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="45">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">My new Header And so on ...</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="36">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Hat geklappt :)</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="49">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="48">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="38">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-header"
                          data-identifier="mimetypes-x-content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-header"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Nur Headertest#2</span>
                                <span class="title-default title-normal-casing">Modified:
						04-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="53">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						08-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="37">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Nun also Header,auf 3 Zeilen?</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="39">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Frontend editing only</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="43">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                    </div>
                </div>

            </div>

        </div>
    </div>
</div>

RightBarDetails.css

#t3-frontend-editing__right-bar--open + .t3-frontend-editing__right-bar {
    transition: right 0.2s linear;
}

#t3-frontend-editing__right-bar--open:checked + .t3-frontend-editing__right-bar {
    /*display: none;*/
    right: 0;
}

#t3-frontend-editing__right-bar--open:checked + .t3-frontend-editing__right-bar .top-right-title .right-bar-button {
    left: 0;
}

details .accordion-content {
    display: block;
}

details[open] .icon-icons-arrow-down:before {
    content: "\e90f";
}

RightBarDetails.html

<input type="checkbox" id="t3-frontend-editing__right-bar--open"/>
<div class="t3-frontend-editing__right-bar">
    <div class="top-right-bar-wrapper ">
        <div class="top-right-relative">
            <div class="top-right-title">
                <label for="t3-frontend-editing__right-bar--open"
                       class="right-bar-button icons icon-icons-arrow-double"
                       title="TOOLS &amp; PROPERTIES"></label>
                <span class="title-right">
					TOOLS &amp; PROPERTIES
				</span>
                <span class="title-icon-right icons icon-icons-tools-settings"></span>
            </div>

            <div class="devices hidden-elements">
                <div class="media-devices-wrapper">
                    <div class="media-devices">
                        <span class="media-device-lg-desktop icons icon-icons-lg-desktop active"
                              data-width="100%" data-height="100%"></span>
                        <span class="media-device-desktop icons icon-icons-desktop"
                              data-width="1280px" data-height="100%"></span>
                        <span class="media-device-tablet icons icon-icons-tablet"
                              data-width="960px" data-height="100%"></span>
                        <span class="media-device-phone icons icon-icons-phone"
                              data-width="640px" data-height="100%"></span>
                    </div>
                </div>
                <div class="hidden-elements-toggle-wrapper">
                    <button class="hidden-elements-toggle-button t3-frontend-editing__show-hidden-items"
                            title="Hidden elements"
                            data-url="http://t3-test.lndo.site:8000/?&amp;show_hidden_items=0&amp;show_hidden_items=1&amp;frontend_editing=true&amp;no_cache=1&amp;show_hidden_items=1">
                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 300 300" xml:space="preserve" class="hidden-elements-toggle-icon" width="48" height="48">
<g>
	<path class="eye" d="M201.3,149.8c0,0,0-0.1,0-0.1c0,0,0,0,0-0.1c0,0,0-0.1,0-0.1c0,0,0-0.1,0-0.1c0,0,0,0,0,0c-0.1-0.8-0.5-1.5-1.1-2.1   c-3.2-3.8-7-7.2-10.9-10.3c-8.4-6.7-17.9-12.2-28.5-14.5c-6.1-1.3-12.2-1.4-18.4-0.3c-5.6,1-11,3.1-16,5.6   c-7.9,4-15.1,9.6-21.3,15.8c-1.2,1.2-2.3,2.3-3.4,3.6c-1.4,1.7-1.4,3.6,0,5.3c3.2,3.8,7,7.2,10.9,10.3c8.4,6.7,17.9,12.2,28.5,14.5   c6.1,1.3,12.2,1.4,18.4,0.3c5.6-1,11-3.1,16-5.6c7.9-4,15.1-9.6,21.3-15.8c1.2-1.2,2.3-2.3,3.4-3.6c0.6-0.6,0.9-1.3,1.1-2.1   c0,0,0,0,0,0c0,0,0-0.1,0-0.1c0,0,0-0.1,0-0.1c0,0,0,0,0-0.1c0,0,0-0.1,0-0.1c0-0.1,0-0.1,0-0.2S201.3,149.9,201.3,149.8z    M151,169.4c-10.7,0-19.4-8.7-19.4-19.4c0-10.7,8.7-19.4,19.4-19.4s19.4,8.7,19.4,19.4S161.7,169.4,151,169.4z"></path>
</g>
<circle class="eye-pupil" cx="151" cy="150" r="6.4"></circle>
<g class="eye-border">
	<g>
		<path d="M242.3,246.3h-11v-10h6v-6h10v11C247.3,244.1,245.1,246.3,242.3,246.3z"></path>
	</g>
	<g>
		<path d="M208.4,246.3h-22.9v-10h22.9V246.3z M162.5,246.3h-22.9v-10h22.9V246.3z M116.6,246.3H93.7v-10h22.9V246.3z"></path>
	</g>
	<g>
		<path d="M70.7,246.3h-11c-2.8,0-5-2.2-5-5v-11h10v6h6V246.3z"></path>
	</g>
	<g>
		<path d="M64.7,207.3h-10v-22.9h10V207.3z M64.7,161.5h-10v-22.9h10V161.5z M64.7,115.6h-10V92.7h10V115.6z"></path>
	</g>
	<g>
		<path d="M64.7,69.7h-10v-11c0-2.8,2.2-5,5-5h11v10h-6V69.7z"></path>
	</g>
	<g>
		<path d="M208.4,63.7h-22.9v-10h22.9V63.7z M162.5,63.7h-22.9v-10h22.9V63.7z M116.6,63.7H93.7v-10h22.9V63.7z"></path>
	</g>
	<g>
		<path d="M247.3,69.7h-10v-6h-6v-10h11c2.8,0,5,2.2,5,5V69.7z"></path>
	</g>
	<g>
		<path d="M247.3,207.3h-10v-22.9h10V207.3z M247.3,161.5h-10v-22.9h10V161.5z M247.3,115.6h-10V92.7h10V115.6z"></path>
	</g>
</g>
</svg>
                    </button>
                </div>
            </div>
        </div>
        <div class="elements-wrapper">
            <div class="elements">


                <details class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                         data-wizard-type="common">
                    <summary class="accordion">
                        <div class="element-title">
                            <span for="checkCollapseCE" class="title-left">Typical page content</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <span for="checkCollapseCE" class="icons icon-icons-arrow-down trigger"></span>
                        </div>
                    </summary>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=header&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Header Only' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-header"
                                  data-identifier="content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-header"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Header Only</span>
                                <span class="title-default title-normal-casing">Adds a header only.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=text&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Regular Text Element' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-text"
                                  data-identifier="content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-text"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Regular Text Element</span>
                                <span class="title-default title-normal-casing">A regular text element with header and bodytext fields.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=textpic&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Text &amp; Images' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-textpic"
                                  data-identifier="content-textpic">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-textpic"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Text &amp; Images</span>
                                <span class="title-default title-normal-casing">Any number of images wrapped right around a regular text element.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=image&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Images Only' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-image"
                                  data-identifier="content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-image"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Images Only</span>
                                <span class="title-default title-normal-casing">Any number of images aligned in columns and rows with a caption.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=textmedia&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Text &amp; Media' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-textmedia"
                                  data-identifier="content-textmedia">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-textmedia"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Text &amp; Media</span>
                                <span class="title-default title-normal-casing">Any number of media wrapped right around a regular text element.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=bullets&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Bullet List' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-bullets"
                                  data-identifier="content-bullets">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-bullets"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Bullet List</span>
                                <span class="title-default title-normal-casing">A single bullet list.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=table&amp;defVals[tt_content][tx_gridelements_columns]=0&amp;defVals[tt_content][bodytext]="
                             title="Drag and drop on page to create a new 'Table' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-table"
                                  data-identifier="content-table">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-table"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Table</span>
                                <span class="title-default title-normal-casing">A simple table.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=uploads&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'File Links' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-uploads"
                                  data-identifier="content-special-uploads">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-uploads"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">File Links</span>
                                <span class="title-default title-normal-casing">Makes a list of files for download.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=card_card&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Card' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_card_card"
                                  data-identifier="tx_card_card">
	<span class="icon-markup">
<span class="icon-unify"><i class="fa fa-align-center"></i></span>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Card</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=card_jselement&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'js element' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_card_jselement"
                                  data-identifier="tx_card_jselement">
	<span class="icon-markup">
<img src="/typo3conf/ext/card/Resources/Public/Icons/Content/jselement.png"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">js element</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=multicolumn&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Multicolumn Container' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx-multicolumn-wizard-icon"
                                  data-identifier="tx-multicolumn-wizard-icon">
	<span class="icon-markup">
<img src="/typo3conf/ext/multicolumn/Resources/Public/Icons/multicolumn.gif"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Multicolumn Container</span>
                                <span class="title-default title-normal-casing">This content element allows you to create dynamic columns.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=mymaskexport_simple_text&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Simple_Text' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_mymaskexport_simple_text"
                                  data-identifier="tx_mymaskexport_simple_text">
	<span class="icon-markup">
<span class="icon-unify"><i class="fa fa-angellist"></i></span>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Simple_Text</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                    </div>
                </details>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="forms">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseFormElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Form elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseFormElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=form_formframework&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Form' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-form"
                                  data-identifier="content-form">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-form"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Form</span>
                                <span class="title-default title-normal-casing">A form that allows website users to submit messages.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=felogin_login&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Login Form' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-elements-login"
                                  data-identifier="content-elements-login">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-elements-login"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Login Form</span>
                                <span class="title-default title-normal-casing">Login/logout form used to password protect pages allowing only authorised website users and groups access.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="menu">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseMenu" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Menu</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseMenu" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_abstract&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Abstracts' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-abstract"
                                  data-identifier="content-menu-abstract">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-abstract"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Abstracts</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages including abstracts</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_categorized_content&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Categorized content' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-categorized"
                                  data-identifier="content-menu-categorized">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-categorized"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Categorized content</span>
                                <span class="title-default title-normal-casing">Content elements for selected categories</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_categorized_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Categorized pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-categorized"
                                  data-identifier="content-menu-categorized">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-categorized"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Categorized pages</span>
                                <span class="title-default title-normal-casing">Pages for selected categories</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-pages"
                                  data-identifier="content-menu-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Pages</span>
                                <span class="title-default title-normal-casing">Menu of selected pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_subpages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Subpages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-pages"
                                  data-identifier="content-menu-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Subpages</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_recently_updated&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Recently updated pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-recently-updated"
                                  data-identifier="content-menu-recently-updated">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-recently-updated"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Recently updated pages</span>
                                <span class="title-default title-normal-casing">Menu of recently updated pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_related_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Related pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-related"
                                  data-identifier="content-menu-related">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-related"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Related pages</span>
                                <span class="title-default title-normal-casing">Menu of related pages based on keywords</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_section&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Section index' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-section"
                                  data-identifier="content-menu-section">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-section"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Section index</span>
                                <span class="title-default title-normal-casing">Page content marked for section menus</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_section_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Section index of subpages from selected pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-section"
                                  data-identifier="content-menu-section">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-section"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Section index of subpages from selected pages</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages including sections</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_sitemap&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Sitemap' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-sitemap"
                                  data-identifier="content-menu-sitemap">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-sitemap"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Sitemap</span>
                                <span class="title-default title-normal-casing">Expanded menu of all subpages of the current site</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_sitemap_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Sitemaps of selected pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-sitemap-pages"
                                  data-identifier="content-menu-sitemap-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-sitemap-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Sitemaps of selected pages</span>
                                <span class="title-default title-normal-casing">Expanded menu of all subpages for selected pages</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="plugins">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapsePlugins" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Plugins</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapsePlugins" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=list&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'General Plugin' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-plugin"
                                  data-identifier="content-plugin">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-plugin"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">General Plugin</span>
                                <span class="title-default title-normal-casing">Select this element type to insert a plugin which cannot be found amongst the options below.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="special">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseSpecialElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Special elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseSpecialElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=html&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Plain HTML' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-html"
                                  data-identifier="content-special-html">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-html"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Plain HTML</span>
                                <span class="title-default title-normal-casing">With this element you can insert raw HTML code on the page.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=div&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Divider' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-div"
                                  data-identifier="content-special-div">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-div"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Divider</span>
                                <span class="title-default title-normal-casing">This element inserts a visual divider, which is by default a horizontal line.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=shortcut&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Insert records' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-shortcut"
                                  data-identifier="content-special-shortcut">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-shortcut"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Insert records</span>
                                <span class="title-default title-normal-casing">With this element you can embed other content elements.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="gridelements">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseGridElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Grid Elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseGridElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=gridelements_pi1&amp;defVals[tt_content][tx_gridelements_backend_layout]=1&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Test' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                                  data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Test</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=gridelements_pi1&amp;defVals[tt_content][tx_gridelements_backend_layout]=2&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Grid Element Backend Layout' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                                  data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Grid Element Backend Layout</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                    </div>
                </div>


            </div>
            <div class="elements">


                <div class="content-element-hierarchy-tab dark-transparent-bg accordion-container accordion-list"
                     data-wizard-type="ce-hierarchy-elements">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseElementOnPage" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion ">
                        <div class="element-title">
                            <span class="title-left">Elements on page</span>
                        </div>
                        <div class="element-action">
                            <label for="checkCollapseElementOnPage" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="60">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Kopfzeile h 2</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="58">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text-media"
                          data-identifier="mimetypes-x-content-text-media">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text-media"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						09-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="50">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-image"
                          data-identifier="mimetypes-x-content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-image"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Unsaved Header</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="51">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text-picture"
                          data-identifier="mimetypes-x-content-text-picture">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text-picture"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Text</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="61">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="54">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-header"
                          data-identifier="mimetypes-x-content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-header"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">dddddddd &nbsp;dd</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="47">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-image"
                          data-identifier="mimetypes-x-content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-image"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="46">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">no comment</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="44">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">And another Header</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="62">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="52">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="45">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">My new Header And so on ...</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="36">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Hat geklappt :)</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="49">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="48">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="38">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-header"
                          data-identifier="mimetypes-x-content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-header"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Nur Headertest#2</span>
                                <span class="title-default title-normal-casing">Modified:
						04-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="53">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						08-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="37">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Nun also Header,auf 3 Zeilen?</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="39">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Frontend editing only</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="43">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                    </div>
                </div>

            </div>

        </div>
    </div>
</div>

RightBarRadioButton.css

#t3-frontend-editing__right-bar--open + .t3-frontend-editing__right-bar {
    transition: right 0.2s linear;
}

#t3-frontend-editing__right-bar--open:checked + .t3-frontend-editing__right-bar {
    /*display: none;*/
    right: 0;
}

#t3-frontend-editing__right-bar--open:checked + .t3-frontend-editing__right-bar .top-right-title .right-bar-button {
    left: 0;
}

.accordion-collapse-controll:checked ~ .accordion-content {
    display: block;
}

.accordion-collapse-controll:checked ~ .accordion .icon-icons-arrow-down:before {
    content: "\e90f";
}

RightBarRadioButton.html

<input type="checkbox" id="t3-frontend-editing__right-bar--open"/>
<div class="t3-frontend-editing__right-bar">
    <div class="top-right-bar-wrapper ">
        <div class="top-right-relative">
            <div class="top-right-title">
                <label for="t3-frontend-editing__right-bar--open"
                       class="right-bar-button icons icon-icons-arrow-double"
                       title="TOOLS &amp; PROPERTIES"></label>
                <span class="title-right">
					TOOLS &amp; PROPERTIES
				</span>
                <span class="title-icon-right icons icon-icons-tools-settings"></span>
            </div>

            <div class="devices hidden-elements">
                <div class="media-devices-wrapper">
                    <div class="media-devices">
                        <span class="media-device-lg-desktop icons icon-icons-lg-desktop active"
                              data-width="100%" data-height="100%"></span>
                        <span class="media-device-desktop icons icon-icons-desktop"
                              data-width="1280px" data-height="100%"></span>
                        <span class="media-device-tablet icons icon-icons-tablet"
                              data-width="960px" data-height="100%"></span>
                        <span class="media-device-phone icons icon-icons-phone"
                              data-width="640px" data-height="100%"></span>
                    </div>
                </div>
                <div class="hidden-elements-toggle-wrapper">
                    <button class="hidden-elements-toggle-button t3-frontend-editing__show-hidden-items"
                            title="Hidden elements"
                            data-url="http://t3-test.lndo.site:8000/?&amp;show_hidden_items=0&amp;show_hidden_items=1&amp;frontend_editing=true&amp;no_cache=1&amp;show_hidden_items=1">
                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 300 300" xml:space="preserve" class="hidden-elements-toggle-icon" width="48" height="48">
<g>
	<path class="eye" d="M201.3,149.8c0,0,0-0.1,0-0.1c0,0,0,0,0-0.1c0,0,0-0.1,0-0.1c0,0,0-0.1,0-0.1c0,0,0,0,0,0c-0.1-0.8-0.5-1.5-1.1-2.1   c-3.2-3.8-7-7.2-10.9-10.3c-8.4-6.7-17.9-12.2-28.5-14.5c-6.1-1.3-12.2-1.4-18.4-0.3c-5.6,1-11,3.1-16,5.6   c-7.9,4-15.1,9.6-21.3,15.8c-1.2,1.2-2.3,2.3-3.4,3.6c-1.4,1.7-1.4,3.6,0,5.3c3.2,3.8,7,7.2,10.9,10.3c8.4,6.7,17.9,12.2,28.5,14.5   c6.1,1.3,12.2,1.4,18.4,0.3c5.6-1,11-3.1,16-5.6c7.9-4,15.1-9.6,21.3-15.8c1.2-1.2,2.3-2.3,3.4-3.6c0.6-0.6,0.9-1.3,1.1-2.1   c0,0,0,0,0,0c0,0,0-0.1,0-0.1c0,0,0-0.1,0-0.1c0,0,0,0,0-0.1c0,0,0-0.1,0-0.1c0-0.1,0-0.1,0-0.2S201.3,149.9,201.3,149.8z    M151,169.4c-10.7,0-19.4-8.7-19.4-19.4c0-10.7,8.7-19.4,19.4-19.4s19.4,8.7,19.4,19.4S161.7,169.4,151,169.4z"></path>
</g>
<circle class="eye-pupil" cx="151" cy="150" r="6.4"></circle>
<g class="eye-border">
	<g>
		<path d="M242.3,246.3h-11v-10h6v-6h10v11C247.3,244.1,245.1,246.3,242.3,246.3z"></path>
	</g>
	<g>
		<path d="M208.4,246.3h-22.9v-10h22.9V246.3z M162.5,246.3h-22.9v-10h22.9V246.3z M116.6,246.3H93.7v-10h22.9V246.3z"></path>
	</g>
	<g>
		<path d="M70.7,246.3h-11c-2.8,0-5-2.2-5-5v-11h10v6h6V246.3z"></path>
	</g>
	<g>
		<path d="M64.7,207.3h-10v-22.9h10V207.3z M64.7,161.5h-10v-22.9h10V161.5z M64.7,115.6h-10V92.7h10V115.6z"></path>
	</g>
	<g>
		<path d="M64.7,69.7h-10v-11c0-2.8,2.2-5,5-5h11v10h-6V69.7z"></path>
	</g>
	<g>
		<path d="M208.4,63.7h-22.9v-10h22.9V63.7z M162.5,63.7h-22.9v-10h22.9V63.7z M116.6,63.7H93.7v-10h22.9V63.7z"></path>
	</g>
	<g>
		<path d="M247.3,69.7h-10v-6h-6v-10h11c2.8,0,5,2.2,5,5V69.7z"></path>
	</g>
	<g>
		<path d="M247.3,207.3h-10v-22.9h10V207.3z M247.3,161.5h-10v-22.9h10V161.5z M247.3,115.6h-10V92.7h10V115.6z"></path>
	</g>
</g>
</svg>
                    </button>
                </div>
            </div>
        </div>
        <div class="elements-wrapper">
            <div class="elements">


                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="common">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseCE" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <label for="checkCollapseCE" class="title-left">Typical page content</label>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseCE" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=header&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Header Only' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-header"
                                  data-identifier="content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-header"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Header Only</span>
                                <span class="title-default title-normal-casing">Adds a header only.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=text&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Regular Text Element' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-text"
                                  data-identifier="content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-text"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Regular Text Element</span>
                                <span class="title-default title-normal-casing">A regular text element with header and bodytext fields.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=textpic&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Text &amp; Images' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-textpic"
                                  data-identifier="content-textpic">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-textpic"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Text &amp; Images</span>
                                <span class="title-default title-normal-casing">Any number of images wrapped right around a regular text element.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=image&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Images Only' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-image"
                                  data-identifier="content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-image"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Images Only</span>
                                <span class="title-default title-normal-casing">Any number of images aligned in columns and rows with a caption.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=textmedia&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Text &amp; Media' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-textmedia"
                                  data-identifier="content-textmedia">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-textmedia"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Text &amp; Media</span>
                                <span class="title-default title-normal-casing">Any number of media wrapped right around a regular text element.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=bullets&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Bullet List' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-bullets"
                                  data-identifier="content-bullets">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-bullets"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Bullet List</span>
                                <span class="title-default title-normal-casing">A single bullet list.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=table&amp;defVals[tt_content][tx_gridelements_columns]=0&amp;defVals[tt_content][bodytext]="
                             title="Drag and drop on page to create a new 'Table' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-table"
                                  data-identifier="content-table">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-table"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Table</span>
                                <span class="title-default title-normal-casing">A simple table.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=uploads&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'File Links' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-uploads"
                                  data-identifier="content-special-uploads">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-uploads"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">File Links</span>
                                <span class="title-default title-normal-casing">Makes a list of files for download.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=card_card&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Card' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_card_card"
                                  data-identifier="tx_card_card">
	<span class="icon-markup">
<span class="icon-unify"><i class="fa fa-align-center"></i></span>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Card</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=card_jselement&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'js element' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_card_jselement"
                                  data-identifier="tx_card_jselement">
	<span class="icon-markup">
<img src="/typo3conf/ext/card/Resources/Public/Icons/Content/jselement.png"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">js element</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=multicolumn&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Multicolumn Container' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx-multicolumn-wizard-icon"
                                  data-identifier="tx-multicolumn-wizard-icon">
	<span class="icon-markup">
<img src="/typo3conf/ext/multicolumn/Resources/Public/Icons/multicolumn.gif"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Multicolumn Container</span>
                                <span class="title-default title-normal-casing">This content element allows you to create dynamic columns.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=mymaskexport_simple_text&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Simple_Text' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-tx_mymaskexport_simple_text"
                                  data-identifier="tx_mymaskexport_simple_text">
	<span class="icon-markup">
<span class="icon-unify"><i class="fa fa-angellist"></i></span>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Simple_Text</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="forms">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseFormElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Form elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseFormElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=form_formframework&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Form' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-form"
                                  data-identifier="content-form">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-form"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Form</span>
                                <span class="title-default title-normal-casing">A form that allows website users to submit messages.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=felogin_login&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Login Form' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-elements-login"
                                  data-identifier="content-elements-login">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-elements-login"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Login Form</span>
                                <span class="title-default title-normal-casing">Login/logout form used to password protect pages allowing only authorised website users and groups access.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="menu">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseMenu" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Menu</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseMenu" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_abstract&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Abstracts' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-abstract"
                                  data-identifier="content-menu-abstract">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-abstract"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Abstracts</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages including abstracts</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_categorized_content&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Categorized content' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-categorized"
                                  data-identifier="content-menu-categorized">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-categorized"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Categorized content</span>
                                <span class="title-default title-normal-casing">Content elements for selected categories</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_categorized_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Categorized pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-categorized"
                                  data-identifier="content-menu-categorized">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-categorized"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Categorized pages</span>
                                <span class="title-default title-normal-casing">Pages for selected categories</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-pages"
                                  data-identifier="content-menu-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Pages</span>
                                <span class="title-default title-normal-casing">Menu of selected pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_subpages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Subpages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-pages"
                                  data-identifier="content-menu-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Subpages</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_recently_updated&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Recently updated pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-recently-updated"
                                  data-identifier="content-menu-recently-updated">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-recently-updated"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Recently updated pages</span>
                                <span class="title-default title-normal-casing">Menu of recently updated pages</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_related_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Related pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-related"
                                  data-identifier="content-menu-related">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-related"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Related pages</span>
                                <span class="title-default title-normal-casing">Menu of related pages based on keywords</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_section&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Section index' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-section"
                                  data-identifier="content-menu-section">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-section"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Section index</span>
                                <span class="title-default title-normal-casing">Page content marked for section menus</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_section_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Section index of subpages from selected pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-section"
                                  data-identifier="content-menu-section">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-section"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Section index of subpages from selected pages</span>
                                <span class="title-default title-normal-casing">Menu of subpages of selected pages including sections</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_sitemap&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Sitemap' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-sitemap"
                                  data-identifier="content-menu-sitemap">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-sitemap"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Sitemap</span>
                                <span class="title-default title-normal-casing">Expanded menu of all subpages of the current site</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=menu_sitemap_pages&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Sitemaps of selected pages' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-menu-sitemap-pages"
                                  data-identifier="content-menu-sitemap-pages">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-menu-sitemap-pages"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Sitemaps of selected pages</span>
                                <span class="title-default title-normal-casing">Expanded menu of all subpages for selected pages</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="plugins">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapsePlugins" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Plugins</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapsePlugins" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=list&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'General Plugin' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-plugin"
                                  data-identifier="content-plugin">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-plugin"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">General Plugin</span>
                                <span class="title-default title-normal-casing">Select this element type to insert a plugin which cannot be found amongst the options below.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="special">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseSpecialElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Special elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseSpecialElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=html&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Plain HTML' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-html"
                                  data-identifier="content-special-html">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-html"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Plain HTML</span>
                                <span class="title-default title-normal-casing">With this element you can insert raw HTML code on the page.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=div&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Divider' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-div"
                                  data-identifier="content-special-div">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-div"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Divider</span>
                                <span class="title-default title-normal-casing">This element inserts a visual divider, which is by default a horizontal line.</span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=shortcut&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Insert records' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-content-special-shortcut"
                                  data-identifier="content-special-shortcut">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/content.svg#content-special-shortcut"></use></svg>
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Insert records</span>
                                <span class="title-default title-normal-casing">With this element you can embed other content elements.</span>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="accordion-grid wizard-elements-tabs dark-transparent-bg accordion-container"
                     data-wizard-type="gridelements">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseGridElements" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion">
                        <div class="element-title">
                            <span class="title-left">Grid Elements</span>
                        </div>
                        <div class="element-action">
                            <span class="icons icon-icons-grid grid "></span>
                            <span class="icons icon-icons-list list-view"></span>
                            <label for="checkCollapseGridElements" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=gridelements_pi1&amp;defVals[tt_content][tx_gridelements_backend_layout]=1&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Test' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                                  data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Test</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                        <div class="element" draggable="true"
                             ondragstart="F.dragCeStart(event)"
                             ondragend="F.dragCeEnd(event)"
                             data-params="&amp;defVals[tt_content][CType]=gridelements_pi1&amp;defVals[tt_content][tx_gridelements_backend_layout]=2&amp;defVals[tt_content][tx_gridelements_columns]=0"
                             title="Drag and drop on page to create a new 'Grid Element Backend Layout' content element.">
						<span class="content-icon">
							<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                                  data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
						</span>
                            <div class="description">
                                <span class="title-default">Grid Element Backend Layout</span>
                                <span class="title-default title-normal-casing"></span>
                            </div>
                        </div>

                    </div>
                </div>


            </div>
            <div class="elements">


                <div class="content-element-hierarchy-tab dark-transparent-bg accordion-container accordion-list"
                     data-wizard-type="ce-hierarchy-elements">
                    <input type="radio" name="rightbar-accordion-collapse" id="checkCollapseElementOnPage" class="accordion-collapse-controll sr-only"/>
                    <div class="accordion ">
                        <div class="element-title">
                            <span class="title-left">Elements on page</span>
                        </div>
                        <div class="element-action">
                            <label for="checkCollapseElementOnPage" class="icons icon-icons-arrow-down trigger"></label>
                        </div>
                    </div>
                    <div class="accordion-content">

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="60">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Kopfzeile h 2</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="58">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text-media"
                          data-identifier="mimetypes-x-content-text-media">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text-media"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						09-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="50">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-image"
                          data-identifier="mimetypes-x-content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-image"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Unsaved Header</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="51">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text-picture"
                          data-identifier="mimetypes-x-content-text-picture">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text-picture"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Text</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="61">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="54">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-header"
                          data-identifier="mimetypes-x-content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-header"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">dddddddd &nbsp;dd</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="47">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-image"
                          data-identifier="mimetypes-x-content-image">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-image"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="46">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">no comment</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="44">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">And another Header</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="62">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="52">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="45">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">My new Header And so on ...</span>
                                <span class="title-default title-normal-casing">Modified:
						17-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="36">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Hat geklappt :)</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="49">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="48">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="38">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-header"
                          data-identifier="mimetypes-x-content-header">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-header"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Nur Headertest#2</span>
                                <span class="title-default title-normal-casing">Modified:
						04-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="53">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						08-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="37">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Nun also Header,auf 3 Zeilen?</span>
                                <span class="title-default title-normal-casing">Modified:
						16-02-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="39">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-mimetypes-x-content-text"
                          data-identifier="mimetypes-x-content-text">
	<span class="icon-markup">
<svg class="icon-color" role="img"><use
        xlink:href="/typo3/sysext/core/Resources/Public/Icons/T3Icons/sprites/mimetypes.svg#mimetypes-x-content-text"></use></svg>
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">Frontend editing only</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                        <div class="element"
                             onmouseover="F.indicateCeStart(event)"
                             onmouseout="F.indicateCeEnd(event)" data-uid="43">

				<span class="content-icon">
					<span class="t3js-icon icon icon-size-default icon-state-default icon-gridelements-default"
                          data-identifier="gridelements-default">
	<span class="icon-markup">
<img src="/typo3conf/ext/gridelements/Resources/Public/Icons/gridelements.svg"
     alt="" width="32" height="32">
	</span>

</span>
				</span>
                            <div class="description">
                                <span class="title-default">[No title]</span>
                                <span class="title-default title-normal-casing">Modified:
						05-01-21
					</span>
                            </div>
                        </div>

                    </div>
                </div>

            </div>

        </div>
    </div>
</div>