commit be71cfa708ba304a6bfc96621581f9187226645f
Author: Sven Wappler <wappler@wappler.systems>
Date:   Mon Aug 10 22:31:21 2026 +0200

    TYPO3 v15 dev-main snapshot ()

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..57872d0
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+/vendor/
diff --git a/Classes/ViewHelpers/Link/ClickEnlargeViewHelper.php b/Classes/ViewHelpers/Link/ClickEnlargeViewHelper.php
new file mode 100644
index 0000000..37e0b84
--- /dev/null
+++ b/Classes/ViewHelpers/Link/ClickEnlargeViewHelper.php
@@ -0,0 +1,81 @@
+<?php
+
+declare(strict_types=1);
+
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+namespace TYPO3\CMS\FluidStyledContent\ViewHelpers\Link;
+
+use Psr\Http\Message\ServerRequestInterface;
+use TYPO3\CMS\Core\Resource\FileInterface;
+use TYPO3\CMS\Core\TypoScript\TypoScriptService;
+use TYPO3\CMS\Core\Utility\GeneralUtility;
+use TYPO3\CMS\Frontend\ContentObject\ContentObjectRenderer;
+use TYPO3Fluid\Fluid\Core\ViewHelper\AbstractViewHelper;
+
+/**
+ * ViewHelper for creating a link for an image popup.
+ *
+ * ```
+ *   <ce:link.clickEnlarge image="{image}" configuration="{settings.images.popup}"><img src=""></ce:link.clickEnlarge>
+ * ```
+ *
+ * @internal this is not part of TYPO3 Core API.
+ */
+final class ClickEnlargeViewHelper extends AbstractViewHelper
+{
+    /**
+     * @var bool
+     */
+    protected $escapeOutput = false;
+
+    public function __construct(
+        private readonly TypoScriptService $typoScriptService,
+    ) {}
+
+    public function initializeArguments(): void
+    {
+        $this->registerArgument('image', FileInterface::class, 'The original image file', true);
+        $this->registerArgument(
+            'configuration',
+            'array',
+            'TypoScript properties for the "imageLinkWrap" function',
+            true
+        );
+    }
+
+    public function render(): string
+    {
+        /** @var FileInterface $image */
+        $image = $this->arguments['image'];
+        $request = $this->renderingContext->getAttribute(ServerRequestInterface::class);
+        $contentObjectRenderer = GeneralUtility::makeInstance(ContentObjectRenderer::class);
+        $contentObjectRenderer->setRequest($request);
+        $contentObjectRenderer->start($request->getAttribute('frontend.page.information')->getPageRecord(), 'pages');
+        $contentObjectRenderer->setCurrentFile($image);
+        $objDataBackup = null;
+        if ($this->renderingContext->getVariableProvider()->exists('data')) {
+            $objDataBackup = $contentObjectRenderer->data;
+            $contentObjectRenderer->data = $this->renderingContext->getVariableProvider()->get('data');
+        }
+        $configuration = $this->typoScriptService->convertPlainArrayToTypoScriptArray($this->arguments['configuration']);
+        $content = $this->renderChildren();
+        $configuration['enable'] = true;
+        $result = $contentObjectRenderer->imageLinkWrap((string)$content, $image, $configuration);
+        if ($objDataBackup) {
+            $contentObjectRenderer->data = $objDataBackup;
+        }
+        return $result;
+    }
+}
diff --git a/Configuration/Services.yaml b/Configuration/Services.yaml
new file mode 100644
index 0000000..ae29e1a
--- /dev/null
+++ b/Configuration/Services.yaml
@@ -0,0 +1,8 @@
+services:
+  _defaults:
+    autowire: true
+    autoconfigure: true
+    public: false
+
+  TYPO3\CMS\FluidStyledContent\:
+    resource: '../Classes/*'
diff --git a/Configuration/Sets/FluidStyledContent/config.yaml b/Configuration/Sets/FluidStyledContent/config.yaml
new file mode 100644
index 0000000..bba0e23
--- /dev/null
+++ b/Configuration/Sets/FluidStyledContent/config.yaml
@@ -0,0 +1 @@
+name: typo3/fluid-styled-content
diff --git a/Configuration/Sets/FluidStyledContent/labels.xlf b/Configuration/Sets/FluidStyledContent/labels.xlf
new file mode 100644
index 0000000..e2b3c76
--- /dev/null
+++ b/Configuration/Sets/FluidStyledContent/labels.xlf
@@ -0,0 +1,152 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff xmlns="urn:oasis:names:tc:xliff:document:1.2" version="1.2">
+  <file source-language="en" datatype="plaintext" original="EXT:fluid_styled_content/Configuration/Sets/FluidStyledContent/labels.xlf" date="2024-09-05T08:00:00Z" product-name="fluid_styled_content">
+    <header/>
+    <body>
+      <trans-unit id="label">
+        <source>Fluid Styled Content</source>
+      </trans-unit>
+      <trans-unit id="categories.fsc">
+        <source>Fluid Styled Content</source>
+      </trans-unit>
+      <trans-unit id="categories.fsc.templates">
+        <source>Templates</source>
+      </trans-unit>
+      <trans-unit id="categories.fsc.content">
+        <source>Content Elements</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.defaultHeaderType">
+        <source>Default Header type</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.defaultHeaderType">
+        <source>Enter the number of the header layout to be used by default</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.shortcut.tables">
+        <source>List of accepted tables</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.lazyLoading">
+        <source>Default settings for browser-native image lazy loading</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.image.lazyLoading">
+        <source>Can be `lazy` (browsers could choose to load images later), `eager` (load images right away) or `auto` (browser will determine whether the image should be lazy loaded or not)</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.lazyLoading.enum.lazy">
+        <source>Lazy</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.lazyLoading.enum.eager">
+        <source>Eager</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.lazyLoading.enum.auto">
+        <source>Auto</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.imageDecoding">
+        <source>Default settings for an image decoding hint to the browser</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.image.imageDecoding">
+        <source>Can be `sync` (synchronously for atomic presentation with other content), `async` (asynchronously to avoid delaying presentation of other content), `auto` (no preference in decoding mode) or an empty value to omit the usage of the decoding attribute (same as `auto`)</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.imageDecoding.enum.sync">
+        <source>Sync</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.imageDecoding.enum.async">
+        <source>Asynchronous</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.image.imageDecoding.enum.auto">
+        <source>Auto</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.maxW">
+        <source>Max Image/Media Width</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.maxW">
+        <source>This indicates that maximum number of pixels (width) a block of media elements inserted as content is allowed to consume</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.maxWInText">
+        <source>Max Image/Media Width (Text)</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.maxWInText">
+        <source>Same as above, but this is the maximum width when text is wrapped around an block of media elements. Default is 50% of the normal Max Media Item Width</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.columnSpacing">
+        <source>Advanced, Column space</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.columnSpacing">
+        <source>Horizontal distance between media elements in a block in content elements of type "Media &amp; Images". If you change this manually in your CSS, you need to adjust this setting accordingly</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.rowSpacing">
+        <source>Advanced, Row space</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.rowSpacing">
+        <source>Vertical distance after each media elements row in content elements of type "Text &amp; Media". If you change this manually in your CSS, you need to adjust this setting accordingly</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.textMargin">
+        <source>Advanced, Margin to text</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.textMargin">
+        <source>Horizontal distance between an imageblock and text in content elements of type "Text &amp; Images"</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.borderColor">
+        <source>Media element border, color</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.borderColor">
+        <source>Bordercolor of media elements in content elements when "Border"-option for an element is set</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.borderWidth">
+        <source>Media element border, thickness</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.borderWidth">
+        <source>Thickness of border around media elements in content elements when "Border"-option for element is set</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.borderPadding">
+        <source>Media element border, padding</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.borderPadding">
+        <source>Padding left and right to the media element, around the border</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.linkWrap.width">
+        <source>Click-enlarge Media Width</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.linkWrap.width">
+        <source>This specifies the width of the enlarged media element when click-enlarge is enabled</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.linkWrap.height">
+        <source>Click-enlarge Media Height</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.linkWrap.height">
+        <source>This specifies the height of the enlarged media element when click-enlarge is enabled</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.linkWrap.newWindow">
+        <source>Advanced, New window</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.linkWrap.newWindow">
+        <source>If set, every click-enlarged media element will open in it's own popup window and not the current popup window (which may have a wrong size for the media element to fit in)</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.linkWrap.lightboxEnabled">
+        <source>Lightbox click-enlarge rendering</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.linkWrap.lightboxEnabled">
+        <source>Whether media elements with click-enlarge checked should be rendered lightbox-compliant</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.linkWrap.lightboxCssClass">
+        <source>Lightbox CSS class</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.linkWrap.lightboxCssClass">
+        <source>Which CSS class to use for lightbox links (only applicable if lightbox rendering is enabled)</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.content.textmedia.linkWrap.lightboxRelAttribute">
+        <source>Lightbox rel="" attribute</source>
+      </trans-unit>
+      <trans-unit id="settings.description.styles.content.textmedia.linkWrap.lightboxRelAttribute">
+        <source>Which `rel=""` attribute to use for lightbox links (only applicable if lightbox rendering is enabled)</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.templates.templateRootPath">
+        <source>Path of Fluid Templates for all defined content elements</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.templates.partialRootPath">
+        <source>Path of Fluid Partials for all defined content elements</source>
+      </trans-unit>
+      <trans-unit id="settings.styles.templates.layoutRootPath">
+        <source>Path of Fluid Layouts for all defined content elements</source>
+      </trans-unit>
+    </body>
+  </file>
+</xliff>
diff --git a/Configuration/Sets/FluidStyledContent/settings.definitions.yaml b/Configuration/Sets/FluidStyledContent/settings.definitions.yaml
new file mode 100644
index 0000000..e3aa38a
--- /dev/null
+++ b/Configuration/Sets/FluidStyledContent/settings.definitions.yaml
@@ -0,0 +1,100 @@
+categories:
+  fsc: ~
+  fsc.templates:
+    parent: fsc
+  fsc.content:
+    parent: fsc
+
+settings:
+  styles.content.defaultHeaderType:
+    default: 2
+    type: int
+    category: fsc.content
+  styles.content.shortcut.tables:
+    default: tt_content
+    type: string
+    category: fsc.content
+  styles.content.image.lazyLoading:
+    default: lazy
+    type: string
+    enum:
+      - lazy
+      - eager
+      - auto
+    category: fsc.content
+  styles.content.image.imageDecoding:
+    default: ''
+    type: string
+    enum:
+      - sync
+      - async
+      - auto
+    category: fsc.content
+  styles.content.textmedia.maxW:
+    default: 600
+    type: int
+    category: fsc.content
+  styles.content.textmedia.maxWInText:
+    default: 300
+    type: int
+    category: fsc.content
+  styles.content.textmedia.columnSpacing:
+    default: 10
+    type: int
+    category: fsc.content
+  styles.content.textmedia.rowSpacing:
+    default: 10
+    type: int
+    category: fsc.content
+  styles.content.textmedia.textMargin:
+    default: 10
+    type: int
+    category: fsc.content
+  styles.content.textmedia.borderColor:
+    default: '#000000'
+    type: color
+    category: fsc.content
+  styles.content.textmedia.borderWidth:
+    default: 2
+    type: int
+    category: fsc.content
+  styles.content.textmedia.borderPadding:
+    default: 0
+    type: int
+    category: fsc.content
+  styles.content.textmedia.linkWrap.width:
+    default: 800m
+    type: string
+    category: fsc.content
+  styles.content.textmedia.linkWrap.height:
+    default: 600m
+    type: string
+    category: fsc.content
+  styles.content.textmedia.linkWrap.newWindow:
+    default: false
+    type: bool
+    category: fsc.content
+  styles.content.textmedia.linkWrap.lightboxEnabled:
+    default: false
+    type: bool
+    category: fsc.content
+  styles.content.textmedia.linkWrap.lightboxCssClass:
+    default: lightbox
+    type: string
+    category: fsc.content
+  styles.content.textmedia.linkWrap.lightboxRelAttribute:
+    default: 'lightbox[{field:uid}]'
+    type: string
+    category: fsc.content
+  styles.templates.templateRootPath:
+    default: ''
+    type: string
+    category: fsc.templates
+  styles.templates.partialRootPath:
+    default: ''
+    type: string
+    category: fsc.templates
+  styles.templates.layoutRootPath:
+    default: ''
+    type: string
+    category: fsc.templates
diff --git a/Configuration/Sets/FluidStyledContent/setup.typoscript b/Configuration/Sets/FluidStyledContent/setup.typoscript
new file mode 100644
index 0000000..cbd1251
--- /dev/null
+++ b/Configuration/Sets/FluidStyledContent/setup.typoscript
@@ -0,0 +1 @@
+@import 'EXT:fluid_styled_content/Configuration/TypoScript/setup.typoscript'
diff --git a/Configuration/Sets/FluidStyledContentCss/config.yaml b/Configuration/Sets/FluidStyledContentCss/config.yaml
new file mode 100644
index 0000000..f2c1f37
--- /dev/null
+++ b/Configuration/Sets/FluidStyledContentCss/config.yaml
@@ -0,0 +1,4 @@
+name: typo3/fluid-styled-content-css
+label: Fluid Styled Content CSS
+dependencies:
+  - typo3/fluid-styled-content
diff --git a/Configuration/Sets/FluidStyledContentCss/setup.typoscript b/Configuration/Sets/FluidStyledContentCss/setup.typoscript
new file mode 100644
index 0000000..e7bd756
--- /dev/null
+++ b/Configuration/Sets/FluidStyledContentCss/setup.typoscript
@@ -0,0 +1 @@
+@import 'EXT:fluid_styled_content/Configuration/TypoScript/Styling/setup.typoscript'
diff --git a/Configuration/TCA/Overrides/sys_template.php b/Configuration/TCA/Overrides/sys_template.php
new file mode 100644
index 0000000..70e29f4
--- /dev/null
+++ b/Configuration/TCA/Overrides/sys_template.php
@@ -0,0 +1,14 @@
+<?php
+
+defined('TYPO3') or die();
+
+\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile(
+    'fluid_styled_content',
+    'Configuration/TypoScript/',
+    'Fluid Content Elements'
+);
+\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile(
+    'fluid_styled_content',
+    'Configuration/TypoScript/Styling/',
+    'Fluid Content Elements CSS (optional)'
+);
diff --git a/Configuration/TypoScript/ContentElement/Bullets.typoscript b/Configuration/TypoScript/ContentElement/Bullets.typoscript
new file mode 100644
index 0000000..0c46733
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Bullets.typoscript
@@ -0,0 +1,31 @@
+# Bullet List:
+# A single bullet list.
+#
+# CType: bullets
+
+tt_content.bullets =< lib.contentElement
+tt_content.bullets {
+    templateName = Bullets
+    dataProcessing {
+        10 = split
+        10 {
+            if {
+                value = 2
+                isLessThan.field = bullets_type
+            }
+            fieldName = bodytext
+            removeEmptyEntries = 1
+            as = bullets
+        }
+        20 = comma-separated-value
+        20 {
+            fieldName = bodytext
+            if {
+                value = 2
+                equals.field = bullets_type
+            }
+            fieldDelimiter = |
+            as = bullets
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/Div.typoscript b/Configuration/TypoScript/ContentElement/Div.typoscript
new file mode 100644
index 0000000..52c39f3
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Div.typoscript
@@ -0,0 +1,9 @@
+# Divider:
+# This element inserts a visual divider, which is by default a horizontal line.
+#
+# CType: div
+
+tt_content.div =< lib.contentElement
+tt_content.div {
+    templateName = Div
+}
diff --git a/Configuration/TypoScript/ContentElement/Header.typoscript b/Configuration/TypoScript/ContentElement/Header.typoscript
new file mode 100644
index 0000000..f601fa4
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Header.typoscript
@@ -0,0 +1,9 @@
+# Header Only:
+# Adds a header only.
+#
+# CType: header
+
+tt_content.header =< lib.contentElement
+tt_content.header {
+    templateName = Header
+}
diff --git a/Configuration/TypoScript/ContentElement/Html.typoscript b/Configuration/TypoScript/ContentElement/Html.typoscript
new file mode 100644
index 0000000..24a0a3f
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Html.typoscript
@@ -0,0 +1,9 @@
+# Plain HTML:
+# With this element you can output raw HTML code on the page.
+#
+# CType: html
+
+tt_content.html =< lib.contentElement
+tt_content.html {
+    templateName = Html
+}
diff --git a/Configuration/TypoScript/ContentElement/Image.typoscript b/Configuration/TypoScript/ContentElement/Image.typoscript
new file mode 100644
index 0000000..41429b9
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Image.typoscript
@@ -0,0 +1,23 @@
+# Image:
+# ...
+#
+# CType: image
+
+tt_content.image =< lib.contentElement
+tt_content.image {
+    templateName = Image
+    dataProcessing {
+        10 = files
+        10 {
+            references.fieldName = image
+        }
+        20 = gallery
+        20 {
+            maxGalleryWidth = {$styles.content.textmedia.maxW}
+            maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
+            columnSpacing = {$styles.content.textmedia.columnSpacing}
+            borderWidth = {$styles.content.textmedia.borderWidth}
+            borderPadding = {$styles.content.textmedia.borderPadding}
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuAbstract.typoscript b/Configuration/TypoScript/ContentElement/MenuAbstract.typoscript
new file mode 100644
index 0000000..13d2c6a
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuAbstract.typoscript
@@ -0,0 +1,22 @@
+# Menu of subpages of selected pages including abstracts:
+# ...
+#
+# CType: menu_abstract
+
+tt_content.menu_abstract =< lib.contentElement
+tt_content.menu_abstract {
+    templateName = MenuAbstract
+    dataProcessing {
+        10 = menu
+        10 {
+            special = directory
+            special.value.field = pages
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuCategorizedContent.typoscript b/Configuration/TypoScript/ContentElement/MenuCategorizedContent.typoscript
new file mode 100644
index 0000000..b3a1bb3
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuCategorizedContent.typoscript
@@ -0,0 +1,30 @@
+# Content elements for selected categories:
+# ...
+#
+# CType: menu_categorized_content
+
+tt_content.menu_categorized_content =< lib.contentElement
+tt_content.menu_categorized_content {
+    templateName = MenuCategorizedContent
+    dataProcessing {
+        10 = database-query
+        10 {
+            table = tt_content
+            selectFields = DISTINCT {#tt_content}.*
+            pidInList.data = leveluid : 0
+            recursive = 99
+            join.data = field:selected_categories
+            join.wrap = {#sys_category_record_mm} ON uid = {#sys_category_record_mm}.{#uid_foreign} AND {#sys_category_record_mm}.{#uid_local} IN(|)
+            where.data = field:category_field
+            where.wrap = {#tablenames}='tt_content' and {#fieldname}='|'
+            orderBy = tt_content.sorting
+            as = content
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = image
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuCategorizedPages.typoscript b/Configuration/TypoScript/ContentElement/MenuCategorizedPages.typoscript
new file mode 100644
index 0000000..e94a9e3
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuCategorizedPages.typoscript
@@ -0,0 +1,27 @@
+# Pages for selected categories:
+# ...
+#
+# CType: menu_categorized_pages
+
+tt_content.menu_categorized_pages =< lib.contentElement
+tt_content.menu_categorized_pages {
+    templateName = MenuCategorizedPages
+    dataProcessing {
+        10 = menu
+        10 {
+            special = categories
+            special {
+                value.field = selected_categories
+                relation.field = category_field
+                sorting = title
+                order = asc
+            }
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuPages.typoscript b/Configuration/TypoScript/ContentElement/MenuPages.typoscript
new file mode 100644
index 0000000..8c375bf
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuPages.typoscript
@@ -0,0 +1,22 @@
+# Menu of selected pages:
+# ...
+#
+# CType: menu_pages
+
+tt_content.menu_pages =< lib.contentElement
+tt_content.menu_pages {
+    templateName = MenuPages
+    dataProcessing {
+        10 = menu
+        10 {
+            special = list
+            special.value.field = pages
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuRecentlyUpdated.typoscript b/Configuration/TypoScript/ContentElement/MenuRecentlyUpdated.typoscript
new file mode 100644
index 0000000..86ec14a
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuRecentlyUpdated.typoscript
@@ -0,0 +1,26 @@
+# Recently updated pages:
+# ...
+#
+# CType: menu_recently_updated
+
+tt_content.menu_recently_updated =< lib.contentElement
+tt_content.menu_recently_updated {
+    templateName = MenuRecentlyUpdated
+    dataProcessing {
+        10 = menu
+        10 {
+            special = updated
+            special {
+                value.field = pages
+                maxAge = 3600*24*7
+                excludeNoSearchPages = 1
+            }
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuRelatedPages.typoscript b/Configuration/TypoScript/ContentElement/MenuRelatedPages.typoscript
new file mode 100644
index 0000000..2ed3138
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuRelatedPages.typoscript
@@ -0,0 +1,26 @@
+# Related pages (based on keywords):
+# ...
+#
+# CType: menu_related_pages
+
+tt_content.menu_related_pages =< lib.contentElement
+tt_content.menu_related_pages {
+    templateName = MenuRelatedPages
+    dataProcessing {
+        10 = menu
+        10 {
+            special = keywords
+            special {
+                value.field = pages
+                excludeNoSearchPages = 1
+            }
+            alternativeSortingField = title
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuSection.typoscript b/Configuration/TypoScript/ContentElement/MenuSection.typoscript
new file mode 100644
index 0000000..807f248
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuSection.typoscript
@@ -0,0 +1,57 @@
+# Section index (page content marked for section menus):
+# ...
+#
+# CType: menu_section
+
+tt_content.menu_section =< lib.contentElement
+tt_content.menu_section {
+    templateName = MenuSection
+    dataProcessing {
+        10 = menu
+        10 {
+            // Always activate includeNotInMenu for a section menu of the current page
+            includeNotInMenu.override = 1
+            includeNotInMenu.override.if.isFalse.field = pages
+            special = list
+            special {
+                value {
+                    field = pages
+                    override {
+                        data = page:uid
+                        if {
+                            isFalse.field = pages
+                        }
+
+                        // Currrent page uses content of another page
+                        override {
+                            data = page:content_from_pid
+                            if {
+                                isTrue.data = page:content_from_pid
+                            }
+                        }
+                    }
+                }
+            }
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+                20 = database-query
+                20 {
+                    table = tt_content
+                    pidInList.field = uid
+                    as = content
+                    where = {#sectionIndex} = 1
+                    orderBy = sorting
+                    dataProcessing {
+                        10 = files
+                        10 {
+                            references.fieldName = image
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuSectionPages.typoscript b/Configuration/TypoScript/ContentElement/MenuSectionPages.typoscript
new file mode 100644
index 0000000..7f52bd9
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuSectionPages.typoscript
@@ -0,0 +1,36 @@
+# Menu of subpages of selected pages including sections:
+# ...
+#
+# CType: menu_section_pages
+
+tt_content.menu_section_pages =< lib.contentElement
+tt_content.menu_section_pages {
+    templateName = MenuSectionPages
+    dataProcessing {
+        10 = menu
+        10 {
+            special = directory
+            special.value.field = pages
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+                20 = database-query
+                20 {
+                    table = tt_content
+                    pidInList.field = uid
+                    where = {#sectionIndex} = 1
+                    orderBy = sorting
+                    as = content
+                    dataProcessing {
+                        10 = files
+                        10 {
+                            references.fieldName = image
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuSitemap.typoscript b/Configuration/TypoScript/ContentElement/MenuSitemap.typoscript
new file mode 100644
index 0000000..1d51288
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuSitemap.typoscript
@@ -0,0 +1,21 @@
+# Sitemap:
+# ...
+#
+# CType: menu_sitemap
+
+tt_content.menu_sitemap =< lib.contentElement
+tt_content.menu_sitemap {
+    templateName = MenuSitemap
+    dataProcessing {
+        10 = menu
+        10 {
+            levels = 7
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuSitemapPages.typoscript b/Configuration/TypoScript/ContentElement/MenuSitemapPages.typoscript
new file mode 100644
index 0000000..e304020
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuSitemapPages.typoscript
@@ -0,0 +1,23 @@
+# Sitemaps of selected pages:
+# ...
+#
+# CType: menu_sitemap_pages
+
+tt_content.menu_sitemap_pages =< lib.contentElement
+tt_content.menu_sitemap_pages {
+    templateName = MenuSitemapPages
+    dataProcessing {
+        10 = menu
+        10 {
+            special = directory
+            special.value.field = pages
+            levels = 7
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/MenuSubpages.typoscript b/Configuration/TypoScript/ContentElement/MenuSubpages.typoscript
new file mode 100644
index 0000000..25e2301
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/MenuSubpages.typoscript
@@ -0,0 +1,22 @@
+# Menu of subpages of selected pages:
+# ...
+#
+# CType: menu_subpages
+
+tt_content.menu_subpages =< lib.contentElement
+tt_content.menu_subpages {
+    templateName = MenuSubpages
+    dataProcessing {
+        10 = menu
+        10 {
+            special = directory
+            special.value.field = pages
+            dataProcessing {
+                10 = files
+                10 {
+                    references.fieldName = media
+                }
+            }
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/Shortcut.typoscript b/Configuration/TypoScript/ContentElement/Shortcut.typoscript
new file mode 100644
index 0000000..9eac0e6
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Shortcut.typoscript
@@ -0,0 +1,16 @@
+# Insert records:
+# This element embeds other content elements.
+#
+# CType: shortcut
+
+tt_content.shortcut =< lib.contentElement
+tt_content.shortcut {
+    templateName = Shortcut
+
+    # Keep this, since the "conf" option can be used
+    variables.shortcuts = RECORDS
+    variables.shortcuts {
+        source.field = records
+        tables = {$styles.content.shortcut.tables}
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/Table.typoscript b/Configuration/TypoScript/ContentElement/Table.typoscript
new file mode 100644
index 0000000..ca83d52
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Table.typoscript
@@ -0,0 +1,32 @@
+# Table:
+# A simple table.
+#
+# CType: table
+
+tt_content.table =< lib.contentElement
+tt_content.table {
+    templateName = Table
+    dataProcessing {
+        10 = comma-separated-value
+        10 {
+            fieldName = bodytext
+            fieldDelimiter.char.cObject = TEXT
+            fieldDelimiter.char.cObject {
+                field = table_delimiter
+            }
+            fieldEnclosure.char.cObject = TEXT
+            fieldEnclosure.char.cObject {
+                field = table_enclosure
+            }
+            fieldEnclosure {
+              if {
+                value = 0
+                equals.field = table_enclosure
+                negate = 1
+              }
+            }
+            maximumColumns.field = cols
+            as = table
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/Text.typoscript b/Configuration/TypoScript/ContentElement/Text.typoscript
new file mode 100644
index 0000000..a5b567c
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Text.typoscript
@@ -0,0 +1,9 @@
+# Regular Text Element:
+# A regular text element with header and bodytext fields.
+#
+# CType: text
+
+tt_content.text =< lib.contentElement
+tt_content.text {
+    templateName = Text
+}
diff --git a/Configuration/TypoScript/ContentElement/Textmedia.typoscript b/Configuration/TypoScript/ContentElement/Textmedia.typoscript
new file mode 100644
index 0000000..2c7ad25
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Textmedia.typoscript
@@ -0,0 +1,23 @@
+# Text & Media:
+# Any number of media wrapped right around a regular text element.
+#
+# CType: textmedia
+
+tt_content.textmedia =< lib.contentElement
+tt_content.textmedia {
+    templateName = Textmedia
+    dataProcessing {
+        10 = files
+        10 {
+            references.fieldName = assets
+        }
+        20 = gallery
+        20 {
+            maxGalleryWidth = {$styles.content.textmedia.maxW}
+            maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
+            columnSpacing = {$styles.content.textmedia.columnSpacing}
+            borderWidth = {$styles.content.textmedia.borderWidth}
+            borderPadding = {$styles.content.textmedia.borderPadding}
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/Textpic.typoscript b/Configuration/TypoScript/ContentElement/Textpic.typoscript
new file mode 100644
index 0000000..bf8cb3a
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Textpic.typoscript
@@ -0,0 +1,23 @@
+# Text and Images:
+# Text with images.
+#
+# CType: textpic
+
+tt_content.textpic =< lib.contentElement
+tt_content.textpic {
+    templateName = Textpic
+    dataProcessing {
+        10 = files
+        10 {
+            references.fieldName = image
+        }
+        20 = gallery
+        20 {
+            maxGalleryWidth = {$styles.content.textmedia.maxW}
+            maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
+            columnSpacing = {$styles.content.textmedia.columnSpacing}
+            borderWidth = {$styles.content.textmedia.borderWidth}
+            borderPadding = {$styles.content.textmedia.borderPadding}
+        }
+    }
+}
diff --git a/Configuration/TypoScript/ContentElement/Uploads.typoscript b/Configuration/TypoScript/ContentElement/Uploads.typoscript
new file mode 100644
index 0000000..5321dc8
--- /dev/null
+++ b/Configuration/TypoScript/ContentElement/Uploads.typoscript
@@ -0,0 +1,18 @@
+# File Links:
+# Makes a list of files for download.
+#
+# CType: uploads
+
+tt_content.uploads =< lib.contentElement
+tt_content.uploads {
+    templateName = Uploads
+    dataProcessing {
+        10 = files
+        10 {
+            references.fieldName = media
+            collections.field = file_collections
+            sorting.field = filelink_sorting
+            sorting.direction.field = filelink_sorting_direction
+        }
+    }
+}
diff --git a/Configuration/TypoScript/Helper/ContentElement.typoscript b/Configuration/TypoScript/Helper/ContentElement.typoscript
new file mode 100644
index 0000000..3354f15
--- /dev/null
+++ b/Configuration/TypoScript/Helper/ContentElement.typoscript
@@ -0,0 +1,46 @@
+# Default configuration for content elements which are using FLUIDTEMPLATE directly
+lib.contentElement >
+lib.contentElement = FLUIDTEMPLATE
+lib.contentElement {
+    templateName = Default
+    templateRootPaths {
+        0 = EXT:fluid_styled_content/Resources/Private/Templates/
+        10 = {$styles.templates.templateRootPath}
+    }
+    partialRootPaths {
+        0 = EXT:fluid_styled_content/Resources/Private/Partials/
+        10 = {$styles.templates.partialRootPath}
+    }
+    layoutRootPaths {
+        0 = EXT:fluid_styled_content/Resources/Private/Layouts/
+        10 = {$styles.templates.layoutRootPath}
+    }
+    settings {
+        defaultHeaderType = {$styles.content.defaultHeaderType}
+        media {
+            lazyLoading = {$styles.content.image.lazyLoading}
+            imageDecoding = {$styles.content.image.imageDecoding}
+            popup {
+                bodyTag = <body style="margin:0; background:#fff;">
+                wrap = <a href="javascript:close();"> | </a>
+                width = {$styles.content.textmedia.linkWrap.width}
+                height = {$styles.content.textmedia.linkWrap.height}
+                crop.data = file:current:crop
+                JSwindow = 1
+                JSwindow {
+                    newWindow = {$styles.content.textmedia.linkWrap.newWindow}
+                    if.isFalse = {$styles.content.textmedia.linkWrap.lightboxEnabled}
+                }
+                directImageLink = {$styles.content.textmedia.linkWrap.lightboxEnabled}
+                linkParams.ATagParams.dataWrap =  class="{$styles.content.textmedia.linkWrap.lightboxCssClass}" rel="{$styles.content.textmedia.linkWrap.lightboxRelAttribute}"
+            }
+            additionalConfig {
+                no-cookie = 1
+                api = 0
+            }
+        }
+    }
+    dataProcessing {
+        1770716912 = record-transformation
+    }
+}
diff --git a/Configuration/TypoScript/Styling/setup.typoscript b/Configuration/TypoScript/Styling/setup.typoscript
new file mode 100644
index 0000000..161fd2d
--- /dev/null
+++ b/Configuration/TypoScript/Styling/setup.typoscript
@@ -0,0 +1,80 @@
+plugin.tx_frontend._CSS_DEFAULT_STYLE (
+    .ce-align-left { text-align: left; }
+    .ce-align-center { text-align: center; }
+    .ce-align-right { text-align: right; }
+
+    .ce-table td, .ce-table th { vertical-align: top; }
+
+    .ce-textpic, .ce-image, .ce-nowrap .ce-bodytext, .ce-gallery, .ce-row, .ce-uploads li, .ce-uploads div { overflow: hidden; }
+
+    .ce-left .ce-gallery, .ce-column { float: left; }
+    .ce-center .ce-outer { position: relative; float: right; right: 50%; }
+    .ce-center .ce-inner { position: relative; float: right; right: -50%; }
+    .ce-right .ce-gallery { float: right; }
+
+    .ce-gallery figure { display: table; margin: 0; }
+    .ce-gallery figcaption { display: table-caption; caption-side: bottom; }
+    .ce-gallery img { display: block; }
+    .ce-gallery iframe { border-width: 0; }
+    .ce-border img,
+    .ce-border iframe {
+        border: {$styles.content.textmedia.borderWidth}px solid {$styles.content.textmedia.borderColor};
+        padding: {$styles.content.textmedia.borderPadding}px;
+    }
+
+    .ce-intext.ce-right .ce-gallery, .ce-intext.ce-left .ce-gallery, .ce-above .ce-gallery {
+        margin-bottom: {$styles.content.textmedia.textMargin}px;
+    }
+    .ce-image .ce-gallery { margin-bottom: 0; }
+    .ce-intext.ce-right .ce-gallery { margin-left: {$styles.content.textmedia.textMargin}px; }
+    .ce-intext.ce-left .ce-gallery { margin-right: {$styles.content.textmedia.textMargin}px; }
+    .ce-below .ce-gallery { margin-top: {$styles.content.textmedia.textMargin}px; }
+
+    .ce-column { margin-right: {$styles.content.textmedia.columnSpacing}px; }
+    .ce-column:last-child { margin-right: 0; }
+
+    .ce-row { margin-bottom: {$styles.content.textmedia.rowSpacing}px; }
+    .ce-row:last-child { margin-bottom: 0; }
+
+    .ce-above .ce-bodytext { clear: both; }
+
+    .ce-intext.ce-left ol, .ce-intext.ce-left ul { padding-left: 40px; overflow: auto; }
+
+    /* Headline */
+    .ce-headline-left { text-align: left; }
+    .ce-headline-center { text-align: center; }
+    .ce-headline-right { text-align: right; }
+
+    /* Uploads */
+    .ce-uploads { margin: 0; padding: 0; }
+    .ce-uploads li { list-style: none outside none; margin: 1em 0; }
+    .ce-uploads img { float: left; padding-right: 1em; vertical-align: top; }
+    .ce-uploads span { display: block; }
+
+    /* Table */
+    .ce-table { width: 100%; max-width: 100%; }
+    .ce-table th, .ce-table td { padding: 0.5em 0.75em; vertical-align: top; }
+    .ce-table thead th { border-bottom: 2px solid #dadada; }
+    .ce-table th, .ce-table td { border-top: 1px solid #dadada; }
+    .ce-table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0,0,0,.05); }
+    .ce-table-bordered th, .ce-table-bordered td { border: 1px solid #dadada; }
+
+    /* Space */
+    .frame-space-before-extra-small { margin-top: 1em; }
+    .frame-space-before-small { margin-top: 2em; }
+    .frame-space-before-medium { margin-top: 3em; }
+    .frame-space-before-large { margin-top: 4em; }
+    .frame-space-before-extra-large { margin-top: 5em; }
+    .frame-space-after-extra-small { margin-bottom: 1em; }
+    .frame-space-after-small { margin-bottom: 2em; }
+    .frame-space-after-medium { margin-bottom: 3em; }
+    .frame-space-after-large { margin-bottom: 4em; }
+    .frame-space-after-extra-large { margin-bottom: 5em; }
+
+    /* Frame */
+    .frame-ruler-before:before { content: ''; display: block; border-top: 1px solid rgba(0,0,0,0.25); margin-bottom: 2em; }
+    .frame-ruler-after:after { content: ''; display: block; border-bottom: 1px solid rgba(0,0,0,0.25); margin-top: 2em; }
+    .frame-indent { margin-left: 15%; margin-right: 15%; }
+    .frame-indent-left { margin-left: 33%; }
+    .frame-indent-right { margin-right: 33%; }
+)
diff --git a/Configuration/TypoScript/constants.typoscript b/Configuration/TypoScript/constants.typoscript
new file mode 100644
index 0000000..fda7334
--- /dev/null
+++ b/Configuration/TypoScript/constants.typoscript
@@ -0,0 +1,56 @@
+styles.templates {
+    # cat=content/templates/b1; type=string; label= Path of Fluid Templates for all defined content elements
+    templateRootPath =
+    # cat=content/templates/b2; type=string; label= Path of Fluid Partials for all defined content elements
+    partialRootPath =
+    # cat=content/templates/b3; type=string; label= Path of Fluid Layouts for all defined content elements
+    layoutRootPath =
+}
+
+styles.content {
+    # cat=content/cHeader/h0; type=int[1-5]; label=Default Header type: Enter the number of the header layout to be used by default
+    defaultHeaderType = 2
+
+    # cat=content/cShortcut/t0; type=string; label=List of accepted tables
+    shortcut.tables = tt_content
+
+    # cat=content/cImage/a0; type=options[lazy,eager,auto,]; label=Default settings for browser-native image lazy loading: Can be "lazy" (browsers could choose to load images later), "eager" (load images right away) or "auto" (browser will determine whether the image should be lazy loaded or not)
+    image.lazyLoading = lazy
+
+    # cat=content/cImage/a1; type=options[sync,async,auto,]; label=Default settings for an image decoding hint to the browser: Can be "sync" (synchronously for atomic presentation with other content), "async" (asynchronously to avoid delaying presentation of other content), "auto" (no preference in decoding mode) or an empty value to omit the usage of the decoding attribute (same as "auto")
+    image.imageDecoding =
+
+  textmedia {
+        # cat=content/cTextmedia/b1; type=int+; label= Max Image/Media Width: This indicates that maximum number of pixels (width) a block of media elements inserted as content is allowed to consume
+        maxW = 600
+        # cat=content/cTextmedia/b2; type=int+; label= Max Image/Media Width (Text): Same as above, but this is the maximum width when text is wrapped around an block of media elements. Default is 50% of the normal Max Media Item Width
+        maxWInText = 300
+
+        # cat=content/cTextmedia/g1; type=int[0-100]; label= Advanced, Column space: Horizontal distance between media elements in a block in content elements of type "Media & Images". If you change this manually in your CSS, you need to adjust this setting accordingly
+        columnSpacing = 10
+        # cat=content/cTextmedia/g2; type=int[0-100]; label= Advanced, Row space: Vertical distance after each media elements row in content elements of type ""Text & Media". If you change this manually in your CSS, you need to adjust this setting accordingly
+        rowSpacing = 10
+        # cat=content/cTextmedia/g3; type=int[0-100]; label= Advanced, Margin to text: Horizontal distance between an imageblock and text in content elements of type "Text & Images"
+        textMargin = 10
+
+        # cat=content/cTextmedia/i1; type=color; label= Media element border, color: Bordercolor of media elements in content elements when "Border"-option for an element is set
+        borderColor = #000000
+        # cat=content/cTextmedia/i2; type=int[0-100]; label= Media element border, thickness: Thickness of border around media elements in content elements when "Border"-option for element is set
+        borderWidth = 2
+        # cat=content/cTextmedia/i3; type=int+; label= Media element border, padding: Padding left and right to the media element, around the border
+        borderPadding = 0
+
+        # cat=content/cTextmedia/c1; type=string; label= Click-enlarge Media Width: This specifies the width of the enlarged media element when click-enlarge is enabled
+        linkWrap.width = 800m
+        # cat=content/cTextmedia/c2; type=string; label= Click-enlarge Media Height: This specifies the height of the enlarged media element when click-enlarge is enabled
+        linkWrap.height = 600m
+        # cat=content/cTextmedia/c3; type=boolean; label= Advanced, New window: If set, every click-enlarged media element will open in it's own popup window and not the current popup window (which may have a wrong size for the media element to fit in)
+        linkWrap.newWindow = 0
+        # cat=content/cTextmedia/c4; type=boolean; label= Lightbox click-enlarge rendering: Whether media elements with click-enlarge checked should be rendered lightbox-compliant
+        linkWrap.lightboxEnabled = 0
+        # cat=content/cTextmedia/c5; type=string; label= Lightbox CSS class: Which CSS class to use for lightbox links (only applicable if lightbox rendering is enabled)
+        linkWrap.lightboxCssClass = lightbox
+        # cat=content/cTextmedia/c6; type=string; label= Lightbox rel="" attribute: Which rel="" attribute to use for lightbox links (only applicable if lightbox rendering is enabled)
+        linkWrap.lightboxRelAttribute = lightbox[{field:uid}]
+    }
+}
diff --git a/Configuration/TypoScript/setup.typoscript b/Configuration/TypoScript/setup.typoscript
new file mode 100644
index 0000000..3e7e093
--- /dev/null
+++ b/Configuration/TypoScript/setup.typoscript
@@ -0,0 +1,28 @@
+# Include setup
+@import './Helper/ContentElement.typoscript'
+
+# Typical content elements
+@import './ContentElement/Bullets.typoscript'
+@import './ContentElement/Div.typoscript'
+@import './ContentElement/Header.typoscript'
+@import './ContentElement/Html.typoscript'
+@import './ContentElement/Image.typoscript'
+@import './ContentElement/Shortcut.typoscript'
+@import './ContentElement/Table.typoscript'
+@import './ContentElement/Text.typoscript'
+@import './ContentElement/Textmedia.typoscript'
+@import './ContentElement/Textpic.typoscript'
+@import './ContentElement/Uploads.typoscript'
+
+# Menu content elements
+@import './ContentElement/MenuAbstract.typoscript'
+@import './ContentElement/MenuCategorizedContent.typoscript'
+@import './ContentElement/MenuCategorizedPages.typoscript'
+@import './ContentElement/MenuPages.typoscript'
+@import './ContentElement/MenuSubpages.typoscript'
+@import './ContentElement/MenuSection.typoscript'
+@import './ContentElement/MenuSectionPages.typoscript'
+@import './ContentElement/MenuRecentlyUpdated.typoscript'
+@import './ContentElement/MenuRelatedPages.typoscript'
+@import './ContentElement/MenuSitemap.typoscript'
+@import './ContentElement/MenuSitemapPages.typoscript'
diff --git a/Documentation/AddingYourOwnContentElements/Index.rst b/Documentation/AddingYourOwnContentElements/Index.rst
new file mode 100644
index 0000000..cfcfad0
--- /dev/null
+++ b/Documentation/AddingYourOwnContentElements/Index.rst
@@ -0,0 +1,12 @@
+.. include:: /Includes.rst.txt
+
+.. _adding-your-own-content-elements:
+
+================================
+Adding Your Own Content Elements
+================================
+
+.. attention::
+
+   This page has been merged into :ref:`TYPO3 Explained <t3coreapi:adding-your-own-content-elements>`
+   since Core version 8.7.
diff --git a/Documentation/Configuration/ConstantEditor/Index.rst b/Documentation/Configuration/ConstantEditor/Index.rst
new file mode 100644
index 0000000..08cce6f
--- /dev/null
+++ b/Documentation/Configuration/ConstantEditor/Index.rst
@@ -0,0 +1,46 @@
+..  include:: /Includes.rst.txt
+
+..  _constant-editor:
+
+===============
+Constant Editor
+===============
+
+..  versionchanged:: 13.1
+    :ref:`Site sets <site-sets>` have been introduced. The
+    :ref:`settings of the site set <site-set-fluid-styled-content-settings>`
+    superseded using TypoScript constants. Using TypoScript constants is
+    still possible for compatibility reasons.
+
+..  tip::
+    If :ref:`Site sets <t3coreapi:site-sets>` are used, the constant editor might be disabled. You can then edit
+    the settings in the :ref:`settings-editor`.
+
+..  include:: /Images/AutomaticScreenshots/TypoScript/ConstantEditor.rst.txt
+
+..  rst-class:: bignums-xxl
+
+1.  The :guilabel:`Constant Editor` can be found in the
+    :guilabel:`Sites > TypoScript` module.
+
+2.  Select the page in the page tree which contains the root Typoscript record
+    of your website.
+
+3.  Select :guilabel:`Constant Editor` in the dropdown at the top of the
+    :guilabel:`Sites > TypoScript` module.
+
+4.  In the dropdown list select the category :guilabel:`CONTENT`.
+
+5.  This will give you a list with all the constants of this extension.
+    All constants are described and can be edited by clicking the pencil in
+    front of the current value or by editing the available field.
+
+6.  Do not forget to save the new values. The new values will be stored in the
+    "Constants" field of the root template of your website.
+
+..  note::
+    If you use the :guilabel:`Constant Editor` the configuration gets written
+    to the database and cannot be kept under version control. You can cut all
+    values from the constants field of the root TypoScript record and move them
+    to a file in your site package extension. This way you can keep the values
+    under version control.
diff --git a/Documentation/Configuration/Index.rst b/Documentation/Configuration/Index.rst
new file mode 100644
index 0000000..b4e9d96
--- /dev/null
+++ b/Documentation/Configuration/Index.rst
@@ -0,0 +1,30 @@
+.. include:: /Includes.rst.txt
+
+.. _configuration:
+
+=============
+Configuration
+=============
+
+Configuring content elements can be done for the frontend and the backend.
+
+The appearance of the content elements can be changed by overriding the
+:ref:`default settings <site-set-fluid-styled-content-settings>` provided
+by the site set :ref:`"Fluid Styled Content" <site-set-fluid-styled-content>`.
+
+You can also :ref:`override the Fluid
+templates <overriding-fluid-templates>` provided by this extension.
+
+For the backend, fields can be shown or hidden, depending on the fields you are using or
+the fields an editor is allowed to use. Configuration like this is done using
+*Page TSconfig* or *User TSconfig*.
+
+.. toctree::
+   :titlesonly:
+   :glob:
+
+   Sets/Index
+   SettingsEditor/Index
+   ConstantEditor/Index
+   TypoScript/Index
+   OverridingFluidTemplates/Index
diff --git a/Documentation/Configuration/OverridingFluidTemplates/Index.rst b/Documentation/Configuration/OverridingFluidTemplates/Index.rst
new file mode 100644
index 0000000..0ac50e4
--- /dev/null
+++ b/Documentation/Configuration/OverridingFluidTemplates/Index.rst
@@ -0,0 +1,75 @@
+:navigation-title: Overriding templates
+
+.. include:: /Includes.rst.txt
+
+.. _overriding-fluid-templates:
+
+==============================
+Overriding the Fluid templates
+==============================
+
+At :ref:`typoscript` we have described the way content elements are rendered.
+
+By default these settings are done in the :file:`setup.typoscript` file which can be found in the
+:file:`EXT:fluid_styled_content/Configuration/TypoScript/` folder.
+
+.. _overriding-fluid-templates-using-site-sets:
+
+Using the site settings
+=======================
+
+..  versionadded:: 13.1
+    You can now use :ref:`site settings <t3coreapi:sitehandling-settings>` to
+    override the template paths.
+
+In order to override the templates used in `fluid_styled_content` you need a
+custom :ref:`site package <t3sitepackage:start>`.
+
+You can override the default template paths from the
+:ref:`site-set-fluid-styled-content` in your site configuration:
+
+..  literalinclude:: _site-settings.yaml
+    :caption: EXT:site_package/Configuration/Sets/SitePackage/settings.yaml
+
+Now copy the Fluid templates that you want to override into your site package at
+the path configured in the site settings.
+
+.. _overriding-fluid-templates-using-lib-fluidcontent:
+
+Using lib.contentElement
+========================
+
+..  versionchanged:: 13.1
+    It is recommended to use
+    :ref:`site settings <overriding-fluid-templates-using-site-sets>` instead of
+    :typoscript:`lib.contentElement` to override the template paths.
+
+This option gives you the ability to add another `templateRootPath` and can be defined
+the same as `partialRootPaths` and `layoutRootPaths`:
+
+.. code-block:: typoscript
+
+   lib.contentElement {
+      templateRootPaths {
+         200 = EXT:your_extension_key/Resources/Private/Templates/
+      }
+      partialRootPaths {
+         200 = EXT:your_extension_key/Resources/Private/Partials/
+      }
+      layoutRootPaths {
+         200 = EXT:your_extension_key/Resources/Private/Layouts/
+      }
+   }
+
+A content element is using a `templateName`, which is defined in :file:`setup.typoscript`. You
+can override this value, but the template from the extension *fluid_styled_content* will
+not be loaded as its name is still the default value.
+
+.. code-block:: typoscript
+
+   tt_content {
+      bullets {
+         templateName = ChangedName
+      }
+   }
+
diff --git a/Documentation/Configuration/OverridingFluidTemplates/_site-settings.yaml b/Documentation/Configuration/OverridingFluidTemplates/_site-settings.yaml
new file mode 100644
index 0000000..8b6e2b8
--- /dev/null
+++ b/Documentation/Configuration/OverridingFluidTemplates/_site-settings.yaml
@@ -0,0 +1,5 @@
+styles:
+  templates:
+    templateRootPath: EXT:my_site_package/Resources/Private/Extensions/FluidStyledContent/Templates/
+    partialRootPath: EXT:my_site_package/Resources/Private/Extensions/FluidStyledContent/Partials/
+    layoutRootPath: EXT:my_site_package/Resources/Private/Extensions/FluidStyledContent/Layouts/
diff --git a/Documentation/Configuration/Sets/FluidStyledContent.rst b/Documentation/Configuration/Sets/FluidStyledContent.rst
new file mode 100644
index 0000000..6902c2d
--- /dev/null
+++ b/Documentation/Configuration/Sets/FluidStyledContent.rst
@@ -0,0 +1,38 @@
+:navigation-title: Fluid Styled Content
+
+.. include:: /Includes.rst.txt
+
+.. _site-set-fluid-styled-content:
+
+===============================
+Site set "Fluid Styled Content"
+===============================
+
+..  versionadded:: 13.1
+    :ref:`Site sets <t3coreapi:site-sets>` have been added to the extension :composer:`typo3/cms-fluid-styled-content`.
+    See :ref:`include-site-set` on how to use them.
+
+The site set "Fluid Styled Content" includes all TypoScript required to
+display the :ref:`content elements <content-elements>` provided by
+:composer:`typo3/cms-fluid-styled-content`.
+
+Some settings in these content elements like image positions or space settings
+require certain CSS styles. If you want to use the default CSS styles provided
+by TYPO3, include :ref:`site-set-fluid-styled-content-css` in addition to this
+site set.
+
+If you depend on this site set directly instead of :ref:`site-set-fluid-styled-content-css`
+you should provide the missing CSS yourself or disable all `tt_content` fields
+via page TSconfig that lose their function due to missing CSS.
+
+..  _site-set-fluid-styled-content-settings:
+
+Settings provided by site set "Fluid Styled Content"
+====================================================
+
+These settings can be adjusted in the :ref:`settings-editor`.
+
+..  typo3:site-set-settings:: PROJECT:/Configuration/Sets/FluidStyledContent/settings.definitions.yaml
+    :name: fluid-styled-content
+    :type:
+    :Label: Settings of "Fluid Styled Content"
diff --git a/Documentation/Configuration/Sets/FluidStyledContentCss.rst b/Documentation/Configuration/Sets/FluidStyledContentCss.rst
new file mode 100644
index 0000000..ef2e966
--- /dev/null
+++ b/Documentation/Configuration/Sets/FluidStyledContentCss.rst
@@ -0,0 +1,25 @@
+:navigation-title: Fluid Styled Content CSS
+
+.. include:: /Includes.rst.txt
+
+.. _site-set-fluid-styled-content-css:
+
+===================================
+Site set "Fluid Styled Content CSS"
+===================================
+
+..  versionadded:: 13.1
+    :ref:`Site sets <t3coreapi:site-sets>` have been added to the extension :composer:`typo3/cms-fluid-styled-content`.
+    See :ref:`include-site-set` on how to use them.
+
+This site set depends on the :ref:`site-set-fluid-styled-content`. Additionally it
+includes the :confval:`_CSS_DEFAULT_STYLE <t3tsref:plugin-css-default-style>`.
+
+The styles provided by this site set enable the display of settings in content
+elements, including frame styles like `.frame-space-before-large`, styles
+for headlines like `.ce-headline-center` and styles for images like
+`.ce-intext.ce-left`.
+
+If you do not depend on this site set you should provide the according CSS yourself
+or disable all fields in the TCA table that lose their function due to missing
+CSS styles.
diff --git a/Documentation/Configuration/Sets/Index.rst b/Documentation/Configuration/Sets/Index.rst
new file mode 100644
index 0000000..892b2d6
--- /dev/null
+++ b/Documentation/Configuration/Sets/Index.rst
@@ -0,0 +1,41 @@
+.. include:: /Includes.rst.txt
+
+.. _site-sets:
+
+=========
+Site sets
+=========
+
+..  versionadded:: 13.1
+    :ref:`Site sets <t3coreapi:site-sets>` have been added to the extension
+    :composer:`typo3/cms-fluid-styled-content`.
+    See :ref:`include-site-set` on how to use them.
+
+The extension :composer:`typo3/cms-fluid-styled-content` offers two site sets
+that can be included via the Site module or required by your
+:ref:`site package's site set <t3sitepackage:site_set>`.
+
+The settings provided by these sets can be adjusted in the :ref:`settings-editor`.
+
+..  card-grid::
+    :columns: 1
+    :columns-md: 2
+    :gap: 4
+    :class: pb-4
+    :card-height: 100
+
+    ..  card:: :ref:`"Fluid Styled Content" <site-set-fluid-styled-content>`
+
+        The site set "Fluid Styled Content" includes all TypoScript required to
+        display the content elements provided by `fluid_styled_content`.
+
+    ..  card:: :ref:`"Fluid Styled Content CSS" <site-set-fluid-styled-content-css>`
+
+        This site set extends the :ref:`"Fluid Styled Content" <site-set-fluid-styled-content>`
+        site set with default CSS.
+
+..  toctree::
+    :glob:
+    :hidden:
+
+    *
diff --git a/Documentation/Configuration/SettingsEditor/Index.rst b/Documentation/Configuration/SettingsEditor/Index.rst
new file mode 100644
index 0000000..63db1d2
--- /dev/null
+++ b/Documentation/Configuration/SettingsEditor/Index.rst
@@ -0,0 +1,23 @@
+..  include:: /Includes.rst.txt
+
+..  _settings-editor:
+
+===============
+Settings editor
+===============
+
+When the :ref:`site sets of fluid_styled_content <include-site-set>` are included,
+the settings provided by those sets become available in the editor.
+
+You can find the available site settings in module
+:guilabel:`Sites > Setup > Settings`
+
+You can change individual settings here. If the site settings are writable
+you can hit the :guilabel:`Save` button and the settings will be written
+directly to the site settings.
+
+If the settings are not writable you can click the :guilabel:`YAML export`
+button to export the settings. These can then be added by a developer with
+sufficient rights.
+
+The available settings are also described in detail in :ref:`site-sets`.
diff --git a/Documentation/Configuration/TypoScript/Index.rst b/Documentation/Configuration/TypoScript/Index.rst
new file mode 100644
index 0000000..b13ebfa
--- /dev/null
+++ b/Documentation/Configuration/TypoScript/Index.rst
@@ -0,0 +1,96 @@
+.. include:: /Includes.rst.txt
+
+.. _typoscript:
+
+==========
+TypoScript
+==========
+
+At the section :ref:`include-site-set` you have already added the TypoScript by
+depending on the site set.
+
+The TypoScript of the site set includes files located
+in the directory :file:`EXT:fluid_styled_content/Configuration/TypoScript/`.
+
+.. figure:: /Images/ExternalScreenshots/TypoScriptFileStructure.png
+   :alt: Structure of the TypoScript files
+
+   Structure of the TypoScript files
+
+In this folder there are two files:
+
+*   :file:`constants.typoscript` - This file is only used when for compatibility
+    reasons the TypoScript is included via import or `TypoScript` module in the
+    outdated fashion.
+*   :file:`setup.typoscript` - This file will first include some other files
+    which are located in the :file:`Setup/` folder in the same directory. More
+    about these files later.
+
+In the folder :file:`ContentElement/` there are files which are included by the file
+:file:`setup.typoscript` as mentioned above. These files contain the rendering definitions of all
+content elements that are provided by the TYPO3 Core. These are:
+
+-   :file:`Bullets.typoscript` - Configuration for content element "Bullet List"
+
+-   :file:`Div.typoscript` - Configuration for content element "Divider"
+
+-   :file:`Header.typoscript` - Configuration for content element "Header Only"
+
+-   :file:`Html.typoscript` - Configuration for content element "Plain HTML"
+
+-   :file:`Image.typoscript` - Configuration for content element "Image"
+
+-   :file:`List.typoscript` - Configuration for content element "General Plugin"
+
+-   :file:`MenuAbstract.typoscript` - Configuration for content element "Menu of subpages of selected pages including abstracts"
+
+-   :file:`MenuCategorizedContent.typoscript` - Configuration for content element "Content elements for selected categories"
+
+-   :file:`MenuCategorizedPages.typoscript` - Configuration for content element "Pages for selected categories"
+
+-   :file:`MenuPages.typoscript` - Configuration for content element "Menu of selected pages"
+
+-   :file:`MenuRecentlyUpdated.typoscript` - Configuration for content element "Recently updated pages"
+
+-   :file:`MenuRelatedPages.typoscript` - Configuration for content element "Related pages (based on keywords)"
+
+-   :file:`MenuSection.typoscript` - Configuration for content element "Section index (page content marked for section menus)"
+
+-   :file:`MenuSectionPages.typoscript` - Configuration for content element "Menu of subpages of selected pages including sections"
+
+-   :file:`MenuSitemap.typoscript` - Configuration for content element "Sitemap"
+
+-   :file:`MenuSitemapPages.typoscript` - Configuration for content element "Sitemaps of selected pages"
+
+-   :file:`MenuSubpages.typoscript` - Configuration for content element "Menu of subpages of selected pages"
+
+-   :file:`Shortcut.typoscript` - Configuration for content element "Insert records"
+
+-   :file:`Table.typoscript` - Configuration for content element "Table"
+
+-   :file:`Text.typoscript` - Configuration for content element "Regular Text Element"
+
+-   :file:`Textmedia.typoscript` - Configuration for content element "Text and Media"
+
+-   :file:`Textpic.typoscript` - Configuration for content element "Text and Images"
+
+-   :file:`Uploads.typoscript` - Configuration for content element "File Links"
+
+Since we move away from TypoScript as much as possible, these rendering
+definitions only declare the following:
+
+-   Can :ref:`FLUIDTEMPLATE <t3tsref:cobj-fluidtemplate>` be used immediately or
+    do we need data processing first?
+
+    A processor is sometimes used to do some data manipulation before all the data is sent
+    to the Fluid template.
+
+-   Assigning the Fluid template file for each type of content element separately.
+
+In the folder :file:`Helper/` there are files which are included by the file
+:file:`setup.typoscript` as mentioned above. These are:
+
+-   :file:`ContentElement.typoscript` - Default configuration for content
+    elements using :ref:`FLUIDTEMPLATE <t3tsref:cobj-fluidtemplate>`
+
+-   :file:`ParseFunc.typoscript` - Creates persistent ParseFunc setup for non-HTML content
diff --git a/Documentation/ContentElements/Bullets/Index.rst b/Documentation/ContentElements/Bullets/Index.rst
new file mode 100644
index 0000000..5c0acdb
--- /dev/null
+++ b/Documentation/ContentElements/Bullets/Index.rst
@@ -0,0 +1,35 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-bullets:
+
+===========
+Bullet list
+===========
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.rst.txt
+
+With this content element you can provide unordered and ordered bullet lists, but also a
+definition list, in the frontend.
+
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/BulletsBackend.rst.txt
+
+The type of list can be defined with the field :guilabel:`Type of bullets`.
+
+The content is added in the field :guilabel:`Bullet List`, where each new line
+is a new bullet.
+
+.. code-block:: none
+
+   Bullet 1
+   Bullet 2
+   Bullet 3
+
+For definition lists you use one line for a single definition which starts with the term,
+followed by the description, separated by a vertical bar "|".
+
+.. code-block:: none
+
+   Term 1|Description 1
+   Term 2|Description 2
+   Term 3|Description 3
diff --git a/Documentation/ContentElements/Div/Index.rst b/Documentation/ContentElements/Div/Index.rst
new file mode 100644
index 0000000..094360b
--- /dev/null
+++ b/Documentation/ContentElements/Div/Index.rst
@@ -0,0 +1,12 @@
+.. include:: /Includes.rst.txt
+
+
+.. _content-element-div:
+
+=======
+Divider
+=======
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/DividerPageContent.rst.txt
+
+Nothing more than a horizontal rule.
diff --git a/Documentation/ContentElements/Header/Index.rst b/Documentation/ContentElements/Header/Index.rst
new file mode 100644
index 0000000..4b2133d
--- /dev/null
+++ b/Documentation/ContentElements/Header/Index.rst
@@ -0,0 +1,15 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-header:
+
+======
+Header
+======
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.rst.txt
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/HeaderBackend.rst.txt
+
+The content element "Header" will render a header, which can be linked. There is the
+possibility to add a subheader and a date. The fields used for this content elements are
+the same as :ref:`content-elements-general-header`, but with a field for the subheader.
diff --git a/Documentation/ContentElements/Html/Index.rst b/Documentation/ContentElements/Html/Index.rst
new file mode 100644
index 0000000..16c6528
--- /dev/null
+++ b/Documentation/ContentElements/Html/Index.rst
@@ -0,0 +1,14 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-html:
+
+====
+HTML
+====
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.rst.txt
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/HtmlBackend.rst.txt
+
+Insert HTML directly using this content element.
+
diff --git a/Documentation/ContentElements/Index.rst b/Documentation/ContentElements/Index.rst
new file mode 100644
index 0000000..6b86dfb
--- /dev/null
+++ b/Documentation/ContentElements/Index.rst
@@ -0,0 +1,116 @@
+.. include:: /Includes.rst.txt
+
+.. _content-elements:
+
+====================
+The content elements
+====================
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.rst.txt
+
+This chapter describes the default set of content elements provided by TYPO3's
+Core. It will show you a description and screenshots of the backend fields.
+
+.. _content-elements-general:
+
+General fields
+==============
+
+These are fields which are used by (almost) every content element.
+
+
+.. _content-elements-general-header:
+
+Header
+------
+
+Almost every content element can contain a header, which consists of the following parts:
+
+Header
+   The text of the header
+
+Type
+   The type of heading (heading 1, heading 2, heading 3 ... or if the header is hidden).
+   When not choosing an option, the default heading will be used, which can be configured
+   at :ref:`constant-editor`.
+
+Date
+   Have the possibility to group the header with a date
+
+Link
+   Link wrapping the header text. This can be a TYPO3 CMS page, an external page, an email
+   address or a link to a file.
+
+The header fields can be found in the :guilabel:`General` tab of a content element.
+
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/HeaderBackend.rst.txt
+
+
+.. _content-elements-general-show-in-section-menus:
+
+Show in Section Menus
+----------------------
+
+Using this option will only be visible when using menu's based on sections. This will be
+described in the chapter :ref:`content-element-menu`.
+
+This field can be found in the :guilabel:`Appearance` tab.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.rst.txt
+
+A :guilabel:`Section Menu`, which is in turn a content element itself
+produces an output including the headlines of all content elements
+with the flag :guilabel:`Show in Section Menus` set.
+
+.. _content-elements-general-link-to-top:
+
+Append with Link to Top of Page
+-------------------------------
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.rst.txt
+
+When checked, this will render a link below the content element to bring the visitor the
+top of the page. This will be very convenient for your visitors when having long pages.
+
+.. _content-elements-general-access:
+
+Access
+------
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/AccessTab.rst.txt
+
+These fields define if and when a visitor has access to this content element. The access
+fields all reside in the :guilabel:`Access` tab:
+
+Visibility of content element
+   By checking this option the content element will not be visible to any visitor.
+
+Publish Date
+   The date on which the content has to be published, which means making visible at a
+   certain date.
+
+Expiration Date
+   The date on which the content will be expired, which means the content will be hidden
+   on a certain date
+
+Usergroup Access Rights
+   Here you can select whether the content element only is available to a certain
+   frontend user group, if it has to be visible only when the visitor is logged in or if
+   it has to be hidden at a login.
+
+.. toctree::
+   :maxdepth: 5
+   :titlesonly:
+   :glob:
+
+   Header/Index
+   TextMedia/Index
+   Bullets/Index
+   Table/Index
+   Uploads/Index
+   Menu/Index
+   Shortcut/Index
+   List/Index
+   Div/Index
+   Html/Index
diff --git a/Documentation/ContentElements/List/Index.rst b/Documentation/ContentElements/List/Index.rst
new file mode 100644
index 0000000..ae4626e
--- /dev/null
+++ b/Documentation/ContentElements/List/Index.rst
@@ -0,0 +1,18 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-list:
+
+=============
+Insert plugin
+=============
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/PluginContentElements.rst.txt
+
+Extensions often provide plugins to render frontend output. They are essentially the
+same as content elements. When an extension depends on a plugin, select the
+plugin in this content element. The fields might change depending on the plugin.
+
+For example, the system extension *indexed_search* provides the *Indexed Search*
+plugin which does not offer any additional fields:
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/PluginBackend.rst.txt
diff --git a/Documentation/ContentElements/Menu/Index.rst b/Documentation/ContentElements/Menu/Index.rst
new file mode 100644
index 0000000..f4fa442
--- /dev/null
+++ b/Documentation/ContentElements/Menu/Index.rst
@@ -0,0 +1,96 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-menu:
+
+=====
+Menus
+=====
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/MenuContentElements.rst.txt
+
+In websites, menus are often created outside the content element scope, because they have
+to reappear within every page. These could be the main menu, a sub menu, a bread crumb or
+a language menu. However, there are situations where you would like to create a menu
+specifically on one page. The following content elements will give you some options to render
+a menu. These available content elements are:
+
+Menu of selected pages
+   The menu consists of links to the selected pages in the TYPO3 CMS backend.
+
+Menu of subpages of selected pages
+   The menu consists of links to the subpages of the selected pages in the TYPO3 CMS
+   backend.
+
+Menu of subpages of selected pages including abstracts
+   The same as above, but showing the abstract of these pages as well, when not empty.
+
+Menu of subpages of selected pages including sections
+   This will render a menu of the subpages of the selected pages. Below each subpage an
+   extra menu will be showing the titles of content elements which belong to that certain
+   subpage, which have the option "Show in Section Menus" in the :guilabel:`Appearance` tab enabled.
+   This makes it possible for the website visitor to jump to the selected content element,
+   within that page, immediately.
+
+Sitemap
+   Render a full sitemap of the website, starting at the root page.
+
+Sitemaps of selected pages
+   Render one or more sitemaps at once. The starting point of each site map will be a
+   single selected page.
+
+Section index (page content marked for section menus)
+   Menu of content elements within the selected page, which have the option "Show in
+   Section Menus" in the :guilabel:`Appearance` tab enabled. This makes it possible for the website
+   visitor to jump to the selected content element, within that page, immediately.
+
+Recently updated pages
+   Shows a list of pages which are updated in the last 7 days. Updated only means a
+   change in the page properties, not the content on the page.
+
+Related pages (based on keywords)
+   Shows a list of the selected page and all other pages, which have one or more keywords,
+   entered in the page properties, in common.
+
+Pages for selected categories
+   Displays a menu of all pages which have been assigned one or more of the selected
+   categories.
+
+Content elements for selected categories
+   Displays a menu of all content elements which have been assigned one or more of the
+   selected categories.
+
+The availability of links in each type of menu will depend on access rights. If a website
+visitor has no access to a certain part (with a frontend login), the link will not be
+shown.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/MenuBackend.rst.txt
+
+In case no pages are selected, the menu will be rendered from the
+current page where the menu is put on.
+
+Styling of the current page in a menu
+======================================
+
+.. versionadded:: 12.0
+    All menu content elements related to page navigation reflect the "current"
+    state of a page now.
+
+If the current page is displayed within a menu the aria attribute
+:html:`aria-current="page"` is added to the a-tag of a menu-item.
+
+For styling with CSS the attribute of the link can be used:
+
+.. code-block:: css
+    :caption: EXT:site_package/Public/Css/menu.css
+
+    [aria-current="page"] {
+       /* Special style for the current page link */
+    }
+    [aria-current="page"]:hover {
+       /* Special style for the current page link when hovered */
+    }
+    [aria-current="page"]::before {
+       /* Special virtual element for additions like chevrons, etc. */
+    }
+
+The default styling of contains no style for the current page.
diff --git a/Documentation/ContentElements/Shortcut/Index.rst b/Documentation/ContentElements/Shortcut/Index.rst
new file mode 100644
index 0000000..40c349b
--- /dev/null
+++ b/Documentation/ContentElements/Shortcut/Index.rst
@@ -0,0 +1,28 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-shortcut:
+
+==============
+Insert Records
+==============
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.rst.txt
+
+Ever have content on one page that you want to reference on another page? But you don't want to have to
+maintain both and keep them both in sync? And you don't want to show the whole content from one
+page on another. Using insert records you can add one content element from a page or all
+the content elements from a page. You can also add content elements from several pages.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.rst.txt
+
+Just select the content elements you want to display and if necessary, put them in the
+right order.
+
+In the frontend the referenced content elements will show up the same as the original one
+(if the styling is not different for that page)
+
+.. note::
+
+   This is the only content element still using a small amount of TypoScript in the rendering
+   process. This is done because you can add different rendering for records from
+   different tables. Take a look at :typoscript:`tt_content.shortcut.20`.
diff --git a/Documentation/ContentElements/Table/Index.rst b/Documentation/ContentElements/Table/Index.rst
new file mode 100644
index 0000000..06d07b5
--- /dev/null
+++ b/Documentation/ContentElements/Table/Index.rst
@@ -0,0 +1,42 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-table:
+
+=====
+Table
+=====
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.rst.txt
+
+The :guilabel:`Table` content element can be used to display tabular data.
+
+.. hint::
+    In the database the data is saved as comma separated values (CSV), a
+    plain text format for storing table data (numbers and text). This format
+    can be used to import data from external sources.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/TableBackend.rst.txt
+
+By default the :guilabel:`Field delimiter` is a vertical bar "|", the
+:guilabel:`Text enclosure` set to **none**.
+
+A :guilabel:`Table caption` can be provided as a heading for the table.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.rst.txt
+
+Also some appearance options are available for the table. These can be found in the
+:guilabel:`Appearance` tab:
+
+Columns
+   The maximum amount of columns. Even when more columns are defined in the
+   :guilabel:`Table content` field, the table will only show the maximum amount of columns.
+
+Table class
+   Some predefined classes to style the table output.
+
+Table header position
+   The first row or the first column can be used as a table header.
+
+Use table footer
+   The last row will be used to group the table's footer area (which may be a summary, an
+   addition of column values, or some call to action based on the preceding content).
diff --git a/Documentation/ContentElements/TextMedia/Index.rst b/Documentation/ContentElements/TextMedia/Index.rst
new file mode 100644
index 0000000..b9b107f
--- /dev/null
+++ b/Documentation/ContentElements/TextMedia/Index.rst
@@ -0,0 +1,36 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-textmedia:
+
+=============
+Text & Images
+=============
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.rst.txt
+
+This content element allows you to combine text and images. Additionally there
+is also a content element for :guilabel:`Text & Media` where you can use videos
+or Audio. There are also separate content elements for :guilabel:`Text`
+or :guilabel:`Images` individually. These offer no advantage over the content element
+:guilabel:`Text & Images` except that some fields are missing and the backend form
+is less cluttered.
+
+The text can be entered in the rich text editor of the :guilabel:`General`
+tab.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/RteBackend.rst.txt
+
+The media elements can be added in the :guilabel:`Images` tab. In this tab
+there is also the option to turn the *enlarge on click* behaviour on for images.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/MediaBackend.rst.txt
+
+Multiple images and movies are combined as a gallery, which can be configured
+using the :guilabel:`Gallery Settings`. In some installations there are
+specific settings for width or height for each element, if a border
+should be shown around each element, the position of the gallery in relation
+to the text and the amount of columns which should be used for the gallery.
+
+The maximum width of the gallery can be different when the gallery is on
+top or bottom of the text, or inside the text. This can be set using the
+:ref:`constant-editor`.
diff --git a/Documentation/ContentElements/Uploads/Index.rst b/Documentation/ContentElements/Uploads/Index.rst
new file mode 100644
index 0000000..44bbc1a
--- /dev/null
+++ b/Documentation/ContentElements/Uploads/Index.rst
@@ -0,0 +1,39 @@
+.. include:: /Includes.rst.txt
+
+.. _content-element-uploads:
+
+==========
+File links
+==========
+
+.. include:: /Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.rst.txt
+
+This content element gives you the opportunity to offer downloadable files to the visitors
+of your website.
+
+.. include:: /Images/AutomaticScreenshots/ContentElements/UploadsBackend.rst.txt
+
+You can add or select single files but also use a file collection. A file collection can
+be one of the following:
+
+-   A static selection of files
+-   A folder within a storage, holding the files
+-   A file selection by category
+
+When combining both methods, single files and file collections, all files from these
+methods will be presented to the website visitor.
+
+At the bottom of the tab :guilabel:`General` you will find several options how
+the files will be presented:
+
+Display file/icon/thumbnail
+   In this dropdown you can select if you only want to show the file name, the file name
+   and a corresponding icon, based on the file extension, or the file name with a
+   thumbnail, if it is possible for TYPO3 CMS to generate a thumbnail from the file.
+
+Display file size information
+   Will show the file size calculated from the amount of bytes and presented as a human
+   readable string with the proper unit (B, KB, MB ...).
+
+Display description
+   Will display the description of each file, if available.
diff --git a/Documentation/FirstSteps/DefaultTemplate.rst b/Documentation/FirstSteps/DefaultTemplate.rst
new file mode 100644
index 0000000..fa426e0
--- /dev/null
+++ b/Documentation/FirstSteps/DefaultTemplate.rst
@@ -0,0 +1,83 @@
+.. include:: /Includes.rst.txt
+
+.. _include-default-typoscript:
+.. _using-the-rendering-definitions:
+
+=======================
+Use TypoScript includes
+=======================
+
+..  versionchanged:: 13.1
+    If you included the :ref:`site sets <include-site-set>`, skip this step.
+
+To use the default rendering definitions provided by *fluid_styled_content*, you
+have to add the extension's TypoScript set to your root TypoScript record.
+
+When you are using a site package you can add the following lines to your site
+packages constants.typoscript and setup.typoscript:
+
+.. code-block:: typoscript
+    :caption: my_sitepackage/Configuration/TypoScript/constants.typoscript
+
+    # Import the default constants of EXT:fluid_styled_content
+    @import 'EXT:fluid_styled_content/Configuration/TypoScript/constants.typoscript'
+
+.. code-block:: typoscript
+    :caption: my_sitepackage/Configuration/TypoScript/setup.typoscript
+
+    # Import the default setup of EXT:fluid_styled_content
+    @import 'EXT:fluid_styled_content/Configuration/TypoScript/setup.typoscript'
+
+    # Import the default CSS of EXT:fluid_styled_content
+    @import 'EXT:fluid_styled_content/Configuration/TypoScript/Styling/setup.typoscript'
+
+This is the recommended way as the import of TypoScript can be kept under
+version control this way.
+
+Alternative: Include the TypoScript set in the root TypoScript record
+=====================================================================
+
+It is also still possible to include the TypoScript set directly into
+a TypoScript record. However there are draw backs:
+The import is then stored in the database and not the file system and cannot be
+kept under version control.
+
+.. include:: /Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.rst.txt
+
+.. rst-class:: bignums-xxl
+
+1.  Go to the module :guilabel:`Sites > TypoScript`.
+
+2.  In the page tree, select the page which contains the root TypoScript
+    record of your website.
+
+3.  Select :guilabel:`Edit TypoScript Record` in the dropdown at the top of the
+    :guilabel:`Sites > TypoScript` module.
+
+4.  Click the :guilabel:`Edit the whole TypoScript record`. This will
+    open all the settings of the root TypoScript record:
+
+.. include:: /Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.rst.txt
+
+Go to the tab :guilabel:`Includes` and select
+:guilabel:`Fluid Content Elements` in the
+:guilabel:`Available items` under :guilabel:`Include TypoScript sets`.
+The selection will move to the :guilabel:`Selected items`.
+
+TYPO3 is now using the rendering definitions of *fluid_styled_content* for
+the default set of content elements. This is essentially unstyled HTML5 markup.
+
+You can additionally select :guilabel:`Fluid Content Elements CSS (optional)`.
+This TypoScript set adds some CSS styling to make sure all
+the parts of a content elements have some styling, this will include alignment and positioning.
+This set of styles will not add any colors, make any changes to typography or anything else related to
+your website's visual style. This TypoScript set is optional, as it is common for integrators to
+override the basic styling.
+
+Save the TypoScript record by using the save button at the top of the module.
+
+Next step
+=========
+
+:ref:`Display the content elements <inserting-content-page-template>` in your
+site package template.
diff --git a/Documentation/FirstSteps/DisplayContent.rst b/Documentation/FirstSteps/DisplayContent.rst
new file mode 100644
index 0000000..9381048
--- /dev/null
+++ b/Documentation/FirstSteps/DisplayContent.rst
@@ -0,0 +1,75 @@
+.. include:: /Includes.rst.txt
+
+.. _inserting-content-page-template:
+
+=======================================
+Inserting content in your page template
+=======================================
+
+To get the different columns from the backend displayed in the frontend
+you can use predefined :ref:`CONTENT <t3tsref:cobj-content>` objects or
+the :ref:`DatabaseQueryProcessor <t3tsref:DatabaseQueryProcessor>`.
+
+It is advised to make all your changes in a custom extension, visit the
+:doc:`site package documentation <t3sitepackage:Index>` to find out more.
+
+.. _inserting-content-page-template-fluidtemplate:
+
+Based on the FLUIDTEMPLATE content object (cObj)
+================================================
+
+.. code-block:: typoscript
+
+   lib.dynamicContent = COA
+   lib.dynamicContent {
+      10 = LOAD_REGISTER
+      10.colPos.cObject = TEXT
+      10.colPos.cObject {
+         field = colPos
+         ifEmpty.cObject = TEXT
+         ifEmpty.cObject {
+            value.current = 1
+            ifEmpty = 0
+         }
+      }
+      20 = CONTENT
+      20 {
+         table = tt_content
+         select {
+            orderBy = sorting
+            where = {#colPos}={register:colPos}
+            where.insertData = 1
+         }
+      }
+      90 = RESTORE_REGISTER
+   }
+
+   page = PAGE
+   page {
+      10 = FLUIDTEMPLATE
+      10 {
+         templateName = Default
+         templateRootPaths {
+            0 = EXT:example_package/Resources/Private/Templates/Page/
+         }
+         partialRootPaths {
+            0 = EXT:example_package/Resources/Private/Partials/Page/
+         }
+         layoutRootPaths {
+            0 = EXT:example_package/Resources/Private/Layouts/Page/
+         }
+      }
+   }
+
+.. code-block:: html
+
+   <f:layout name="Default" />
+   <f:section name="Main">
+      <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{colPos: '0'}" />
+   </f:section>
+
+Next step
+=========
+
+You can start :ref:`adding content elements <content-elements>` or make further
+:ref:`configurations <configuration>`.
diff --git a/Documentation/FirstSteps/Index.rst b/Documentation/FirstSteps/Index.rst
new file mode 100644
index 0000000..d4a43b1
--- /dev/null
+++ b/Documentation/FirstSteps/Index.rst
@@ -0,0 +1,18 @@
+.. include:: /Includes.rst.txt
+
+.. _first_steps:
+
+===========
+First steps
+===========
+
+
+.. toctree::
+    :maxdepth: 5
+    :titlesonly:
+    :glob:
+
+    SiteSets
+    DefaultTemplate
+    DisplayContent
+
diff --git a/Documentation/FirstSteps/SiteSets.rst b/Documentation/FirstSteps/SiteSets.rst
new file mode 100644
index 0000000..949600b
--- /dev/null
+++ b/Documentation/FirstSteps/SiteSets.rst
@@ -0,0 +1,65 @@
+:navigation-title: Site set inclusion
+
+..  include:: /Includes.rst.txt
+
+..  _include-site-set:
+
+======================================
+Include one of the available site sets
+======================================
+
+..  versionadded:: 13.1
+    :ref:`Site sets <t3coreapi:site-sets>` have been introduced and are the recommended method to include
+    TypoScript. If you do not want to use site sets, you can still use
+    :ref:`TypoScript includes <include-default-typoscript>` to include the
+    default TypoScript.
+
+To use the default rendering definitions provided by *fluid_styled_content*, you
+should add one of the two :ref:`site sets <site-sets>` provided by this extension
+to your :ref:`site configuration <include-site-set-site>`
+or depend on it in your :ref:`site package's site set <include-site-set-sitepackage>`.
+
+..  _include-site-set-site:
+
+Add the site set to your site configuration
+===========================================
+
+This is the recommended way to include the "Fluid Styled Content" site set into
+basic TYPO3 sites without a custom site package. See also
+:ref:`site sets <t3coreapi:site-sets>`.
+
+.. figure:: /Images/ManualScreenshots/SiteSet.png
+
+   Add the site set of Fluid Styled Content
+
+When saving, the GUI then automatically updates your site configuration:
+
+..  literalinclude:: _site_config.diff
+    :caption: config/sites/my-site/config.yaml (diff)
+
+..  _include-site-set-sitepackage:
+
+Add the site set to your custom site package
+============================================
+
+If your installation has a custom :ref:`site package <t3sitepackage:start>`,
+it is recommended to depend on the "Fluid Styled Content CSS" site set with your
+site package's site set:
+
+..  literalinclude:: _site_package_config.yaml
+    :caption: EXT:my_site_package/Configuration/Sets/MySet/config.yaml
+
+Edit the settings
+=================
+
+..  _include-site-set-editor:
+
+All settings of this extension are now available in the :ref:`settings-editor`.
+
+..  _include-default-site-set-next:
+
+Next step
+=========
+
+:ref:`Display the content elements <inserting-content-page-template>` in your
+site package template.
diff --git a/Documentation/FirstSteps/_site_config.diff b/Documentation/FirstSteps/_site_config.diff
new file mode 100644
index 0000000..33bbca4
--- /dev/null
+++ b/Documentation/FirstSteps/_site_config.diff
@@ -0,0 +1,6 @@
+  base: https://example.ddev.site
++ dependencies:
++   - typo3/fluid-styled-content-css
+  languages:
+    -
+      title: English
diff --git a/Documentation/FirstSteps/_site_package_config.yaml b/Documentation/FirstSteps/_site_package_config.yaml
new file mode 100644
index 0000000..126b4c8
--- /dev/null
+++ b/Documentation/FirstSteps/_site_package_config.yaml
@@ -0,0 +1,4 @@
+name: myvendor/my-site-package
+label: My sitepackage set
+dependencies:
+  - typo3/fluid-styled-content-css
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/AccessTab.png b/Documentation/Images/AutomaticScreenshots/ContentElements/AccessTab.png
new file mode 100644
index 0000000..15a41c3
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/AccessTab.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/AccessTab.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/AccessTab.rst.txt
new file mode 100644
index 0000000..c30f6a3
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/AccessTab.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/AccessTab.png
+   :class: with-shadow
+
+   The Access tab with all its fields
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.png b/Documentation/Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.png
new file mode 100644
index 0000000..01e40ad
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.rst.txt
new file mode 100644
index 0000000..391fd06
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/AppendWithLinkToTopOfPage.png
+   :class: with-shadow
+
+   The field "Append with link to top of page"
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsBackend.png
new file mode 100644
index 0000000..c11dc7d
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsBackend.rst.txt
new file mode 100644
index 0000000..d7b5711
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/BulletsBackend.png
+   :class: with-shadow
+
+   The most important fields of the content element 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsFrontend.png
new file mode 100644
index 0000000..1b32fdb
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsFrontend.rst.txt
new file mode 100644
index 0000000..000dbd0
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/BulletsFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/BulletsFrontend.png
+   :class: with-shadow
+
+   Bullet list examples in the frontend 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderBackend.png
new file mode 100644
index 0000000..61e61fe
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderBackend.rst.txt
new file mode 100644
index 0000000..265b610
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/HeaderBackend.png
+   :class: with-shadow
+
+   The content element "Header" in the backend
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderFrontend.png
new file mode 100644
index 0000000..a1e0db3
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderFrontend.rst.txt
new file mode 100644
index 0000000..9cfb33d
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/HeaderFrontend.png
+   :class: with-shadow
+
+   Header examples in the frontend 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.png
new file mode 100644
index 0000000..8446e2f
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.rst.txt
new file mode 100644
index 0000000..204b095
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/HeaderWithLinkFrontend.png
+   :class: with-shadow
+
+   Header with link
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HtmlBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/HtmlBackend.png
new file mode 100644
index 0000000..588bee4
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/HtmlBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/HtmlBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/HtmlBackend.rst.txt
new file mode 100644
index 0000000..d7a9124
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/HtmlBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/HtmlBackend.png
+   :class: with-shadow
+
+   The content element :guilabel:`Plain HTML` in the backend
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.png
new file mode 100644
index 0000000..c258bdd
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.rst.txt
new file mode 100644
index 0000000..c05f6b3
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/InsertRecordsBackend.png
+   :class: with-shadow
+
+   The content element :guilabel:`Insert Records`
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/MediaBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/MediaBackend.png
new file mode 100644
index 0000000..cc55d8f
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/MediaBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/MediaBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/MediaBackend.rst.txt
new file mode 100644
index 0000000..1b0b194
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/MediaBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/MediaBackend.png
+   :class: with-shadow
+
+   TextImages in the content element :guilabel:`Text & Images`
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/MenuBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuBackend.png
new file mode 100644
index 0000000..7a7b892
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/MenuBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuBackend.rst.txt
new file mode 100644
index 0000000..17a68f0
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/MenuBackend.png
+   :class: with-shadow
+
+   The most important fields of the content element 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/MenuFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuFrontend.png
new file mode 100644
index 0000000..11c3876
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/MenuFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuFrontend.rst.txt
new file mode 100644
index 0000000..2487e5e
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/MenuFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/MenuFrontend.png
+   :class: with-shadow
+
+   Menu example in the frontend 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/PluginBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/PluginBackend.png
new file mode 100644
index 0000000..6c16658
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/PluginBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/PluginBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/PluginBackend.rst.txt
new file mode 100644
index 0000000..434d6ff
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/PluginBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/PluginBackend.png
+   :class: with-shadow
+
+   The plugin :guilabel:`Indexed Search`
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/RteBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/RteBackend.png
new file mode 100644
index 0000000..245aaa5
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/RteBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/RteBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/RteBackend.rst.txt
new file mode 100644
index 0000000..33c0244
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/RteBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/RteBackend.png
+   :class: with-shadow
+
+   The content element rich text editor in the content element :guilabel:`Text`
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.png
new file mode 100644
index 0000000..5bcaf69
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.rst.txt
new file mode 100644
index 0000000..90a900d
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/SectionMenuFrontend.png
+   :class: with-shadow
+
+   Section menu examples in the frontend 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.png b/Documentation/Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.png
new file mode 100644
index 0000000..01e40ad
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.rst.txt
new file mode 100644
index 0000000..57a970f
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/ShowInSectionMenus.png
+   :class: with-shadow
+
+   The field "Show In Section Menu's"
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.png
new file mode 100644
index 0000000..8c7f4e1
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.rst.txt
new file mode 100644
index 0000000..45e54d9
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/TableAppearanceBackend.png
+   :class: with-shadow
+
+   The content element :guilabel:`Table` in the backend, tab :guilabel:`Appearance`
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TableBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/TableBackend.png
new file mode 100644
index 0000000..d45f96b
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/TableBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TableBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/TableBackend.rst.txt
new file mode 100644
index 0000000..b52fb24
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/TableBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/TableBackend.png
+   :class: with-shadow
+
+   The content element :guilabel:`Table` in the backend
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TableFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/TableFrontend.png
new file mode 100644
index 0000000..7665c7a
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/TableFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TableFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/TableFrontend.rst.txt
new file mode 100644
index 0000000..d0ff590
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/TableFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/TableFrontend.png
+   :class: with-shadow
+
+   :guilabel:`Table` examples in the frontend 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TextImagesFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/TextImagesFrontend.png
new file mode 100644
index 0000000..f5755e3
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/TextImagesFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/TextImagesFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/TextImagesFrontend.rst.txt
new file mode 100644
index 0000000..1b32566
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/TextImagesFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/TextImagesFrontend.png
+   :class: with-shadow
+
+   :guilabel:`Text & Images` examples in the frontend 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsBackend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsBackend.png
new file mode 100644
index 0000000..1a061f9
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsBackend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsBackend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsBackend.rst.txt
new file mode 100644
index 0000000..26aaa0a
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsBackend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/UploadsBackend.png
+   :class: with-shadow
+
+   The content element :guilabel:`Uploads` in the backend
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsFrontend.png b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsFrontend.png
new file mode 100644
index 0000000..1896e46
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsFrontend.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsFrontend.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsFrontend.rst.txt
new file mode 100644
index 0000000..8da6363
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentElements/UploadsFrontend.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentElements/UploadsFrontend.png
+   :class: with-shadow
+
+   :guilabel:`Uploads` examples in the frontend 
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.png
new file mode 100644
index 0000000..57200a2
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.rst.txt
new file mode 100644
index 0000000..df08926
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/BulletTypicalPageContent.png
+   :class: with-shadow
+
+   Typical page content: Bullet List
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/DividerPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/DividerPageContent.png
new file mode 100644
index 0000000..4b92839
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/DividerPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/DividerPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/DividerPageContent.rst.txt
new file mode 100644
index 0000000..50e050d
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/DividerPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/DividerPageContent.png
+   :class: with-shadow
+
+   Divider page content
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.png
new file mode 100644
index 0000000..a92a901
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.rst.txt
new file mode 100644
index 0000000..b5f15d9
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/FileLinksPageContent.png
+   :class: with-shadow
+
+   Typical page content: File Links
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.png
new file mode 100644
index 0000000..3140418
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.rst.txt
new file mode 100644
index 0000000..85eca9d
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/HTMLPageContent.png
+   :class: with-shadow
+
+   Plain HTML page content
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.png
new file mode 100644
index 0000000..23ef89b
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.rst.txt
new file mode 100644
index 0000000..c355770
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/HeaderTypicalPageContent.png
+   :class: with-shadow
+
+   Typical page content: Header
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.png
new file mode 100644
index 0000000..427a292
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.rst.txt
new file mode 100644
index 0000000..7eef5e6
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/InsertRecordsPageContent.png
+   :class: with-shadow
+
+   Insert records page content
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/MenuContentElements.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/MenuContentElements.png
new file mode 100644
index 0000000..a16b369
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/MenuContentElements.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/MenuContentElements.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/MenuContentElements.rst.txt
new file mode 100644
index 0000000..6cc436c
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/MenuContentElements.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/MenuContentElements.png
+   :class: with-shadow
+
+   Menu content elements
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/PluginContentElements.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/PluginContentElements.png
new file mode 100644
index 0000000..bc539b2
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/PluginContentElements.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/PluginContentElements.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/PluginContentElements.rst.txt
new file mode 100644
index 0000000..e536746
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/PluginContentElements.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/PluginContentElements.png
+   :class: with-shadow
+
+   Plugin content elements
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/SpecialContentElements.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/SpecialContentElements.png
new file mode 100644
index 0000000..ceccaf6
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/SpecialContentElements.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/SpecialContentElements.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/SpecialContentElements.rst.txt
new file mode 100644
index 0000000..3a395ff
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/SpecialContentElements.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/SpecialContentElements.png
+   :class: with-shadow
+
+   Special content elements
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.png
new file mode 100644
index 0000000..eade51c
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.rst.txt
new file mode 100644
index 0000000..eaad492
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/TableTypicalPageContent.png
+   :class: with-shadow
+
+   Typical page content: Table List
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.png
new file mode 100644
index 0000000..187891f
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.rst.txt
new file mode 100644
index 0000000..729630c
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/TextMediaTypicalPageContent.png
+   :class: with-shadow
+
+   Typical page content: Text, Images and Media
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.png b/Documentation/Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.png
new file mode 100644
index 0000000..b010793
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.rst.txt b/Documentation/Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.rst.txt
new file mode 100644
index 0000000..dc8d48b
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/ContentOverview/TypicalPageContent.png
+   :class: with-shadow
+
+   Typical page content
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/Introduction/BackendExample.png b/Documentation/Images/AutomaticScreenshots/Introduction/BackendExample.png
new file mode 100644
index 0000000..a168eb4
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/Introduction/BackendExample.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/Introduction/BackendExample.rst.txt b/Documentation/Images/AutomaticScreenshots/Introduction/BackendExample.rst.txt
new file mode 100644
index 0000000..2c10159
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/Introduction/BackendExample.rst.txt
@@ -0,0 +1,7 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/Introduction/BackendExample.png
+   :class: with-shadow
\ No newline at end of file
diff --git a/Documentation/Images/AutomaticScreenshots/TypoScript/ConstantEditor.png b/Documentation/Images/AutomaticScreenshots/TypoScript/ConstantEditor.png
new file mode 100644
index 0000000..fd71edd
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/TypoScript/ConstantEditor.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/TypoScript/ConstantEditor.rst.txt b/Documentation/Images/AutomaticScreenshots/TypoScript/ConstantEditor.rst.txt
new file mode 100644
index 0000000..d2388db
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/TypoScript/ConstantEditor.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/TypoScript/ConstantEditor.png
+   :class: with-shadow
+
+   Include the Fluid Content Elements TypoScript file
diff --git a/Documentation/Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.png b/Documentation/Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.png
new file mode 100644
index 0000000..e16fc27
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.rst.txt b/Documentation/Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.rst.txt
new file mode 100644
index 0000000..47c7d82
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/TypoScript/EditTemplateRecord.png
+   :class: with-shadow
+
+   Edit the whole TypoScript record
diff --git a/Documentation/Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.png b/Documentation/Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.png
new file mode 100644
index 0000000..60309e3
Binary files /dev/null and b/Documentation/Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.png differ
diff --git a/Documentation/Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.rst.txt b/Documentation/Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.rst.txt
new file mode 100644
index 0000000..786d673
--- /dev/null
+++ b/Documentation/Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.rst.txt
@@ -0,0 +1,9 @@
+.. =========================================================
+.. Automatically generated by the TYPO3 Screenshots project.
+.. https://github.com/TYPO3-Documentation/t3docs-screenshots
+.. =========================================================
+
+.. figure:: /Images/AutomaticScreenshots/TypoScript/IncludeTypoScriptTemplate.png
+   :class: with-shadow
+
+   Include the Fluid Content Elements TypoScript file
diff --git a/Documentation/Images/ExternalScreenshots/TypoScriptFileStructure.png b/Documentation/Images/ExternalScreenshots/TypoScriptFileStructure.png
new file mode 100644
index 0000000..beb79eb
Binary files /dev/null and b/Documentation/Images/ExternalScreenshots/TypoScriptFileStructure.png differ
diff --git a/Documentation/Images/ManualScreenshots/Installation/ActivateExtension.png b/Documentation/Images/ManualScreenshots/Installation/ActivateExtension.png
new file mode 100644
index 0000000..b754dc8
Binary files /dev/null and b/Documentation/Images/ManualScreenshots/Installation/ActivateExtension.png differ
diff --git a/Documentation/Images/ManualScreenshots/Introduction/ExampleOutput.png b/Documentation/Images/ManualScreenshots/Introduction/ExampleOutput.png
new file mode 100644
index 0000000..2e72412
Binary files /dev/null and b/Documentation/Images/ManualScreenshots/Introduction/ExampleOutput.png differ
diff --git a/Documentation/Images/ManualScreenshots/Introduction/ExampleOutput.rst.txt b/Documentation/Images/ManualScreenshots/Introduction/ExampleOutput.rst.txt
new file mode 100644
index 0000000..81735a3
--- /dev/null
+++ b/Documentation/Images/ManualScreenshots/Introduction/ExampleOutput.rst.txt
@@ -0,0 +1,3 @@
+
+.. figure:: /Images/ManualScreenshots/Introduction/ExampleOutput.png
+   :class: with-shadow
diff --git a/Documentation/Images/ManualScreenshots/SiteSet.png b/Documentation/Images/ManualScreenshots/SiteSet.png
new file mode 100644
index 0000000..26fdde7
Binary files /dev/null and b/Documentation/Images/ManualScreenshots/SiteSet.png differ
diff --git a/Documentation/Includes.rst.txt b/Documentation/Includes.rst.txt
new file mode 100644
index 0000000..2362507
--- /dev/null
+++ b/Documentation/Includes.rst.txt
@@ -0,0 +1 @@
+..  You can put central messages to display on all pages here
diff --git a/Documentation/Index.rst b/Documentation/Index.rst
new file mode 100644
index 0000000..e38d3bd
--- /dev/null
+++ b/Documentation/Index.rst
@@ -0,0 +1,55 @@
+.. include:: /Includes.rst.txt
+
+..  _start:
+
+=====================================
+TYPO3 Content Elements based on Fluid
+=====================================
+
+:Extension key:
+   fluid_styled_content
+
+:Package name:
+   typo3/cms-fluid-styled-content
+
+:Version:
+   |release|
+
+:Language:
+   en
+
+:Author:
+   TYPO3 contributors
+
+:License:
+   This document is published under the
+   `Open Content License <https://www.openhub.net/licenses/opl>`__.
+
+:Rendered:
+   |today|
+
+----
+
+This extension provides Fluid templating for TYPO3 content elements.
+
+----
+
+**Table of Contents:**
+
+.. toctree::
+   :maxdepth: 2
+   :titlesonly:
+
+   Introduction/Index
+   Installation/Index
+   FirstSteps/Index
+   Configuration/Index
+   ContentElements/Index
+   AddingYourOwnContentElements/Index
+
+.. Meta Menu
+
+.. toctree::
+   :hidden:
+
+   Sitemap
diff --git a/Documentation/Installation/Index.rst b/Documentation/Installation/Index.rst
new file mode 100644
index 0000000..65f3390
--- /dev/null
+++ b/Documentation/Installation/Index.rst
@@ -0,0 +1,61 @@
+.. include:: /Includes.rst.txt
+
+.. _installation:
+
+============
+Installation
+============
+
+This extension is part of the TYPO3 Core.
+
+..  contents:: Table of contents
+    :local:
+
+.. _installation_composer:
+
+Installation with Composer
+==========================
+
+Check whether you are already using the extension with:
+
+..  code-block:: bash
+
+    composer show | grep fluid-styled-content
+
+This should either give you no result or something similar to:
+
+..  code-block:: none
+
+    typo3/cms-fluid-styled-content       v12.4.11
+
+If it is not installed yet, use the ``composer require`` command to install
+the extension:
+
+..  code-block:: bash
+
+    composer require typo3/cms-fluid-styled-content
+
+The given version depends on the version of the TYPO3 Core you are using.
+
+.. _installation_legacy:
+
+Installation without Composer
+=============================
+
+In an installation without Composer, the extension is already shipped but might
+not be activated yet. Activate it as follows:
+
+#.  In the backend, navigate to the :guilabel:`System > Extensions`
+    module.
+#.  Click the :guilabel:`Activate` icon for the Fluid Styled Content extension.
+
+..  figure:: /Images/ManualScreenshots/Installation/ActivateExtension.png
+    :class: with-border
+    :alt: Extension manager showing Fluid Styled Content extension
+
+    Extension manager showing Fluid Styled Content extension
+
+Next step
+=========
+
+Include the :ref:`default TypoScript file <include-default-typoscript>`.
diff --git a/Documentation/Introduction/Index.rst b/Documentation/Introduction/Index.rst
new file mode 100644
index 0000000..5ab961f
--- /dev/null
+++ b/Documentation/Introduction/Index.rst
@@ -0,0 +1,121 @@
+.. include:: /Includes.rst.txt
+
+.. _introduction:
+
+============
+Introduction
+============
+
+.. _what-does-it-do:
+
+What does it do?
+================
+
+*fluid_styled_content* handles the rendering of TYPO3's default content elements
+and comes bundled as part of the Core. These content elements are rendered using
+the Fluid templating engine.
+
+These content elements can be used as-is and can also be modified depending on your
+requirements. You are not bound to using only these content elements. It is possible
+to add new content elements to the existing set. This document details how to use,
+adapt, enhance and create new content elements.
+
+Optionally *fluid_styled_content* offers basic CSS that takes care of
+positioning content according to fields chosen in the backend.
+
+For example, if you create a content element of type
+:guilabel:`Text with Images` with a centered headline, a subheader, some text
+and an image with the position :guilabel:`in text, right`:
+
+.. include:: /Images/AutomaticScreenshots/Introduction/BackendExample.rst.txt
+
+The output of the HTML is rendered by the Fluid template
+:file:`typo3/sysext/fluid_styled_content/Resources/Private/Templates/Textpic.html`
+which in turn includes several partials.
+
+See the following, shortened code example::
+
+    <html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+    <f:layout name="Default" />
+    <f:section name="Header">
+        <f:render partial="Header/All" arguments="{_all}" />
+    </f:section>
+    <f:section name="Main">
+
+        <div class="ce-textpic ce-{gallery.position.horizontal} ce-{gallery.position.vertical}">
+            <f:render partial="Media/Gallery" arguments="{_all}" />
+
+            <f:if condition="{data.bodytext}">
+                <div class="ce-bodytext">
+                    <f:format.html>{data.bodytext}</f:format.html>
+                </div>
+            </f:if>
+        </div>
+
+    </f:section>
+    </html>
+
+The  HTML output then looks like this:
+
+.. code-block:: html
+
+    <div id="c1" class="frame frame-default frame-type-textpic frame-layout-0">
+      <header>
+        <h2 class="ce-headline-center">
+          A centered headline
+        </h2>
+        <h3 class="ce-headline-center">
+          A subheader
+        </h3>
+      </header>
+      <div class="ce-textpic ce-right ce-intext">
+        <div class="ce-gallery" data-ce-columns="1" data-ce-images="1">
+          <div class="ce-row">
+            <div class="ce-column">
+              <figure class="image">
+              <img class="image-embed-item"
+                src="/fileadmin/user_upload/TYPO3.png" width="280" height="280" loading="lazy" alt="">
+              </figure>
+            </div>
+          </div>
+        </div>
+        <div class="ce-bodytext">
+          <p>Lorem ipsum dolor sit...</p>
+        </div>
+      </div>
+    </div>
+
+If the default CSS provided by this extension was also included, the output
+could look like the following in the browser:
+
+.. include:: /Images/ManualScreenshots/Introduction/ExampleOutput.rst.txt
+
+.. _history:
+
+A little bit of history
+=======================
+
+In early years, TYPO3's content elements were rendered by the Typoscript set called
+*content (default)*. This was mainly based on font-tags for styling and tables for
+positioning which was needed to achieve the visual constructions in old versions of web
+browsers.
+
+Some time later the extension *css_styled_content* was introduced, which focused on
+reducing the amount of TypoScript and providing XHTML/HTML5 markup which could be styled
+by Cascading Style Sheets (CSS), a style sheet language used for describing the look and
+formatting of a document written in a markup language. Still this extension was heavily
+based on TypoScript and did allow custom modifications up to some point.
+
+Since the introduction of the Fluid templating engine, more websites are using this for
+page templating. Newer TYPO3 CMS packages (extensions) are also using Fluid as their base
+templating engine. The content elements which were provided with TYPO3 CMS by default were
+still using TypoScript and some PHP code.
+
+Since TYPO3 7.5 the default content elements are provided by the extension
+*fluid_styled_content* and thus use Fluid as template engine. The main benefit being that
+hardly any knowledge of TypoScript is now needed to make changes. Integrators can easily
+exchange the base content element Fluid templates with their own. With Fluid, more complex
+functionality that exceed the simple output of values has to be implemented with
+ViewHelpers. Every ViewHelper has its own PHP class. Several basic ViewHelpers are
+provided by Fluid. When using your own Fluid templates, developers can add extra
+functionality with their own ViewHelpers.
diff --git a/Documentation/Sitemap.rst b/Documentation/Sitemap.rst
new file mode 100644
index 0000000..09d3c6f
--- /dev/null
+++ b/Documentation/Sitemap.rst
@@ -0,0 +1,9 @@
+:template: sitemap.html
+
+.. include:: /Includes.rst.txt
+
+=======
+Sitemap
+=======
+
+.. The sitemap.html template will insert here the page tree automatically.
diff --git a/Documentation/guides.xml b/Documentation/guides.xml
new file mode 100644
index 0000000..2505858
--- /dev/null
+++ b/Documentation/guides.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<guides xmlns="https://www.phpdoc.org/guides" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:schemaLocation="https://www.phpdoc.org/guides ../vendor/phpdocumentor/guides-cli/resources/schema/guides.xsd"
+        links-are-relative="true">
+    <extension class="\T3Docs\Typo3DocsTheme\DependencyInjection\Typo3DocsThemeExtension"
+               project-home="https://extensions.typo3.org/extension/fluid_styled_content/"
+               project-contact="https://typo3.slack.com/archives/C025BQLFA"
+               project-repository="https://github.com/typo3/typo3"
+               project-issues="https://forge.typo3.org/projects/typo3cms-core/issues"
+               edit-on-github-branch="main"
+               edit-on-github="typo3/typo3"
+               edit-on-github-directory="typo3/sysext/fluid_styled_content/Documentation/"
+               typo3-core-preferred="main"
+               interlink-shortcode="typo3/cms-fluid-styled-content"
+    />
+    <project title="Fluid Styled Content"
+             release="main (development)"
+             version="main (development)"
+             copyright="since 2015 by the TYPO3 contributors"
+    />
+</guides>
diff --git a/LICENSE.txt b/LICENSE.txt
new file mode 100644
index 0000000..d159169
--- /dev/null
+++ b/LICENSE.txt
@@ -0,0 +1,339 @@
+                    GNU GENERAL PUBLIC LICENSE
+                       Version 2, June 1991
+
+ Copyright (C) 1989, 1991 Free Software Foundation, Inc.,
+ 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The licenses for most software are designed to take away your
+freedom to share and change it.  By contrast, the GNU General Public
+License is intended to guarantee your freedom to share and change free
+software--to make sure the software is free for all its users.  This
+General Public License applies to most of the Free Software
+Foundation's software and to any other program whose authors commit to
+using it.  (Some other Free Software Foundation software is covered by
+the GNU Lesser General Public License instead.)  You can apply it to
+your programs, too.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+this service if you wish), that you receive source code or can get it
+if you want it, that you can change the software or use pieces of it
+in new free programs; and that you know you can do these things.
+
+  To protect your rights, we need to make restrictions that forbid
+anyone to deny you these rights or to ask you to surrender the rights.
+These restrictions translate to certain responsibilities for you if you
+distribute copies of the software, or if you modify it.
+
+  For example, if you distribute copies of such a program, whether
+gratis or for a fee, you must give the recipients all the rights that
+you have.  You must make sure that they, too, receive or can get the
+source code.  And you must show them these terms so they know their
+rights.
+
+  We protect your rights with two steps: (1) copyright the software, and
+(2) offer you this license which gives you legal permission to copy,
+distribute and/or modify the software.
+
+  Also, for each author's protection and ours, we want to make certain
+that everyone understands that there is no warranty for this free
+software.  If the software is modified by someone else and passed on, we
+want its recipients to know that what they have is not the original, so
+that any problems introduced by others will not reflect on the original
+authors' reputations.
+
+  Finally, any free program is threatened constantly by software
+patents.  We wish to avoid the danger that redistributors of a free
+program will individually obtain patent licenses, in effect making the
+program proprietary.  To prevent this, we have made it clear that any
+patent must be licensed for everyone's free use or not licensed at all.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                    GNU GENERAL PUBLIC LICENSE
+   TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
+
+  0. This License applies to any program or other work which contains
+a notice placed by the copyright holder saying it may be distributed
+under the terms of this General Public License.  The "Program", below,
+refers to any such program or work, and a "work based on the Program"
+means either the Program or any derivative work under copyright law:
+that is to say, a work containing the Program or a portion of it,
+either verbatim or with modifications and/or translated into another
+language.  (Hereinafter, translation is included without limitation in
+the term "modification".)  Each licensee is addressed as "you".
+
+Activities other than copying, distribution and modification are not
+covered by this License; they are outside its scope.  The act of
+running the Program is not restricted, and the output from the Program
+is covered only if its contents constitute a work based on the
+Program (independent of having been made by running the Program).
+Whether that is true depends on what the Program does.
+
+  1. You may copy and distribute verbatim copies of the Program's
+source code as you receive it, in any medium, provided that you
+conspicuously and appropriately publish on each copy an appropriate
+copyright notice and disclaimer of warranty; keep intact all the
+notices that refer to this License and to the absence of any warranty;
+and give any other recipients of the Program a copy of this License
+along with the Program.
+
+You may charge a fee for the physical act of transferring a copy, and
+you may at your option offer warranty protection in exchange for a fee.
+
+  2. You may modify your copy or copies of the Program or any portion
+of it, thus forming a work based on the Program, and copy and
+distribute such modifications or work under the terms of Section 1
+above, provided that you also meet all of these conditions:
+
+    a) You must cause the modified files to carry prominent notices
+    stating that you changed the files and the date of any change.
+
+    b) You must cause any work that you distribute or publish, that in
+    whole or in part contains or is derived from the Program or any
+    part thereof, to be licensed as a whole at no charge to all third
+    parties under the terms of this License.
+
+    c) If the modified program normally reads commands interactively
+    when run, you must cause it, when started running for such
+    interactive use in the most ordinary way, to print or display an
+    announcement including an appropriate copyright notice and a
+    notice that there is no warranty (or else, saying that you provide
+    a warranty) and that users may redistribute the program under
+    these conditions, and telling the user how to view a copy of this
+    License.  (Exception: if the Program itself is interactive but
+    does not normally print such an announcement, your work based on
+    the Program is not required to print an announcement.)
+
+These requirements apply to the modified work as a whole.  If
+identifiable sections of that work are not derived from the Program,
+and can be reasonably considered independent and separate works in
+themselves, then this License, and its terms, do not apply to those
+sections when you distribute them as separate works.  But when you
+distribute the same sections as part of a whole which is a work based
+on the Program, the distribution of the whole must be on the terms of
+this License, whose permissions for other licensees extend to the
+entire whole, and thus to each and every part regardless of who wrote it.
+
+Thus, it is not the intent of this section to claim rights or contest
+your rights to work written entirely by you; rather, the intent is to
+exercise the right to control the distribution of derivative or
+collective works based on the Program.
+
+In addition, mere aggregation of another work not based on the Program
+with the Program (or with a work based on the Program) on a volume of
+a storage or distribution medium does not bring the other work under
+the scope of this License.
+
+  3. You may copy and distribute the Program (or a work based on it,
+under Section 2) in object code or executable form under the terms of
+Sections 1 and 2 above provided that you also do one of the following:
+
+    a) Accompany it with the complete corresponding machine-readable
+    source code, which must be distributed under the terms of Sections
+    1 and 2 above on a medium customarily used for software interchange; or,
+
+    b) Accompany it with a written offer, valid for at least three
+    years, to give any third party, for a charge no more than your
+    cost of physically performing source distribution, a complete
+    machine-readable copy of the corresponding source code, to be
+    distributed under the terms of Sections 1 and 2 above on a medium
+    customarily used for software interchange; or,
+
+    c) Accompany it with the information you received as to the offer
+    to distribute corresponding source code.  (This alternative is
+    allowed only for noncommercial distribution and only if you
+    received the program in object code or executable form with such
+    an offer, in accord with Subsection b above.)
+
+The source code for a work means the preferred form of the work for
+making modifications to it.  For an executable work, complete source
+code means all the source code for all modules it contains, plus any
+associated interface definition files, plus the scripts used to
+control compilation and installation of the executable.  However, as a
+special exception, the source code distributed need not include
+anything that is normally distributed (in either source or binary
+form) with the major components (compiler, kernel, and so on) of the
+operating system on which the executable runs, unless that component
+itself accompanies the executable.
+
+If distribution of executable or object code is made by offering
+access to copy from a designated place, then offering equivalent
+access to copy the source code from the same place counts as
+distribution of the source code, even though third parties are not
+compelled to copy the source along with the object code.
+
+  4. You may not copy, modify, sublicense, or distribute the Program
+except as expressly provided under this License.  Any attempt
+otherwise to copy, modify, sublicense or distribute the Program is
+void, and will automatically terminate your rights under this License.
+However, parties who have received copies, or rights, from you under
+this License will not have their licenses terminated so long as such
+parties remain in full compliance.
+
+  5. You are not required to accept this License, since you have not
+signed it.  However, nothing else grants you permission to modify or
+distribute the Program or its derivative works.  These actions are
+prohibited by law if you do not accept this License.  Therefore, by
+modifying or distributing the Program (or any work based on the
+Program), you indicate your acceptance of this License to do so, and
+all its terms and conditions for copying, distributing or modifying
+the Program or works based on it.
+
+  6. Each time you redistribute the Program (or any work based on the
+Program), the recipient automatically receives a license from the
+original licensor to copy, distribute or modify the Program subject to
+these terms and conditions.  You may not impose any further
+restrictions on the recipients' exercise of the rights granted herein.
+You are not responsible for enforcing compliance by third parties to
+this License.
+
+  7. If, as a consequence of a court judgment or allegation of patent
+infringement or for any other reason (not limited to patent issues),
+conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot
+distribute so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you
+may not distribute the Program at all.  For example, if a patent
+license would not permit royalty-free redistribution of the Program by
+all those who receive copies directly or indirectly through you, then
+the only way you could satisfy both it and this License would be to
+refrain entirely from distribution of the Program.
+
+If any portion of this section is held invalid or unenforceable under
+any particular circumstance, the balance of the section is intended to
+apply and the section as a whole is intended to apply in other
+circumstances.
+
+It is not the purpose of this section to induce you to infringe any
+patents or other property right claims or to contest validity of any
+such claims; this section has the sole purpose of protecting the
+integrity of the free software distribution system, which is
+implemented by public license practices.  Many people have made
+generous contributions to the wide range of software distributed
+through that system in reliance on consistent application of that
+system; it is up to the author/donor to decide if he or she is willing
+to distribute software through any other system and a licensee cannot
+impose that choice.
+
+This section is intended to make thoroughly clear what is believed to
+be a consequence of the rest of this License.
+
+  8. If the distribution and/or use of the Program is restricted in
+certain countries either by patents or by copyrighted interfaces, the
+original copyright holder who places the Program under this License
+may add an explicit geographical distribution limitation excluding
+those countries, so that distribution is permitted only in or among
+countries not thus excluded.  In such case, this License incorporates
+the limitation as if written in the body of this License.
+
+  9. The Free Software Foundation may publish revised and/or new versions
+of the General Public License from time to time.  Such new versions will
+be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+Each version is given a distinguishing version number.  If the Program
+specifies a version number of this License which applies to it and "any
+later version", you have the option of following the terms and conditions
+either of that version or of any later version published by the Free
+Software Foundation.  If the Program does not specify a version number of
+this License, you may choose any version ever published by the Free Software
+Foundation.
+
+  10. If you wish to incorporate parts of the Program into other free
+programs whose distribution conditions are different, write to the author
+to ask for permission.  For software which is copyrighted by the Free
+Software Foundation, write to the Free Software Foundation; we sometimes
+make exceptions for this.  Our decision will be guided by the two goals
+of preserving the free status of all derivatives of our free software and
+of promoting the sharing and reuse of software generally.
+
+                            NO WARRANTY
+
+  11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY
+FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW.  EXCEPT WHEN
+OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES
+PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED
+OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE.  THE ENTIRE RISK AS
+TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU.  SHOULD THE
+PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING,
+REPAIR OR CORRECTION.
+
+  12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR
+REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES,
+INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING
+OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED
+TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY
+YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER
+PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE
+POSSIBILITY OF SUCH DAMAGES.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+convey the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software; you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation; either version 2 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License along
+    with this program; if not, write to the Free Software Foundation, Inc.,
+    51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
+
+Also add information on how to contact you by electronic and paper mail.
+
+If the program is interactive, make it output a short notice like this
+when it starts in an interactive mode:
+
+    Gnomovision version 69, Copyright (C) year name of author
+    Gnomovision comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
+    This is free software, and you are welcome to redistribute it
+    under certain conditions; type `show c' for details.
+
+The hypothetical commands `show w' and `show c' should show the appropriate
+parts of the General Public License.  Of course, the commands you use may
+be called something other than `show w' and `show c'; they could even be
+mouse-clicks or menu items--whatever suits your program.
+
+You should also get your employer (if you work as a programmer) or your
+school, if any, to sign a "copyright disclaimer" for the program, if
+necessary.  Here is a sample; alter the names:
+
+  Yoyodyne, Inc., hereby disclaims all copyright interest in the program
+  `Gnomovision' (which makes passes at compilers) written by James Hacker.
+
+  <signature of Ty Coon>, 1 April 1989
+  Ty Coon, President of Vice
+
+This General Public License does not permit incorporating your program into
+proprietary programs.  If your program is a subroutine library, you may
+consider it more useful to permit linking proprietary applications with the
+library.  If this is what you want to do, use the GNU Lesser General
+Public License instead of this License.
diff --git a/README.rst b/README.rst
new file mode 100644
index 0000000..a55e9b8
--- /dev/null
+++ b/README.rst
@@ -0,0 +1,10 @@
+========================================
+TYPO3 extension ``fluid_styled_content``
+========================================
+
+This extension provides Fluid templating for TYPO3 content elements.
+
+:Repository:  https://github.com/typo3/typo3
+:Issues:      https://forge.typo3.org/
+:Read online: https://docs.typo3.org/c/typo3/cms-fluid-styled-content/main/en-us/
+:Packagist:   https://packagist.org/packages/typo3/cms-fluid-styled-content
diff --git a/Resources/Private/Language/locallang.xlf b/Resources/Private/Language/locallang.xlf
new file mode 100644
index 0000000..8022cef
--- /dev/null
+++ b/Resources/Private/Language/locallang.xlf
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff xmlns="urn:oasis:names:tc:xliff:document:1.2" version="1.2">
+  <file source-language="en" datatype="plaintext" original="EXT:fluid_styled_content/Resources/Private/Language/locallang.xlf" date="2014-02-07T20:22:32Z" product-name="fluid_styled_content">
+    <header/>
+    <body>
+      <trans-unit id="toTop">
+        <source>To top</source>
+      </trans-unit>
+    </body>
+  </file>
+</xliff>
diff --git a/Resources/Private/Layouts/Default.fluid.html b/Resources/Private/Layouts/Default.fluid.html
new file mode 100644
index 0000000..c91bf69
--- /dev/null
+++ b/Resources/Private/Layouts/Default.fluid.html
@@ -0,0 +1,53 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+    <f:if condition="{data.frame_class} != none">
+        <f:then>
+
+            <div id="c{data.uid}" class="frame frame-{data.frame_class} frame-type-{data.CType} frame-layout-{data.layout}{f:if(condition: data.space_before_class, then: ' frame-space-before-{data.space_before_class}')}{f:if(condition: data.space_after_class, then: ' frame-space-after-{data.space_after_class}')}">
+                <f:if condition="{data._LOCALIZED_UID}">
+                    <a id="c{data._LOCALIZED_UID}"></a>
+                </f:if>
+                <f:render section="Before" optional="true">
+                    <f:render partial="DropIn/Before/All" arguments="{_all}" />
+                </f:render>
+                <f:render section="Header" optional="true">
+                    <f:render partial="Header/All" arguments="{_all}" />
+                </f:render>
+                <f:render section="Main" optional="true" />
+                <f:render section="Footer" optional="true">
+                    <f:render partial="Footer/All" arguments="{_all}" />
+                </f:render>
+                <f:render section="After" optional="true">
+                    <f:render partial="DropIn/After/All" arguments="{_all}" />
+                </f:render>
+            </div>
+
+        </f:then>
+        <f:else>
+
+            <a id="c{data.uid}"></a>
+            <f:if condition="{data._LOCALIZED_UID}">
+                <a id="c{data._LOCALIZED_UID}"></a>
+            </f:if>
+            <f:if condition="{data.space_before_class}">
+                <div class="frame-space-before-{data.space_before_class}"></div>
+            </f:if>
+            <f:render section="Before" optional="true">
+                <f:render partial="DropIn/Before/All" arguments="{_all}" />
+            </f:render>
+            <f:render section="Header" optional="true">
+                <f:render partial="Header/All" arguments="{_all}" />
+            </f:render>
+            <f:render section="Main" optional="true" />
+            <f:render section="Footer" optional="true">
+                <f:render partial="Footer/All" arguments="{_all}" />
+            </f:render>
+            <f:render section="After" optional="true">
+                <f:render partial="DropIn/After/All" arguments="{_all}" />
+            </f:render>
+            <f:if condition="{data.space_after_class}">
+                <div class="frame-space-after-{data.space_after_class}"></div>
+            </f:if>
+
+        </f:else>
+    </f:if>
+</html>
diff --git a/Resources/Private/Partials/Bullets/Type-0.fluid.html b/Resources/Private/Partials/Bullets/Type-0.fluid.html
new file mode 100644
index 0000000..45b564a
--- /dev/null
+++ b/Resources/Private/Partials/Bullets/Type-0.fluid.html
@@ -0,0 +1,9 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:ce="http://typo3.org/ns/TYPO3/CMS/FluidStyledContent/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{bullets}">
+    <ul class="ce-bullets">
+    <f:for each="{bullets}" as="bullet">
+        <li>{bullet}</li>
+    </f:for>
+    </ul>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Bullets/Type-1.fluid.html b/Resources/Private/Partials/Bullets/Type-1.fluid.html
new file mode 100644
index 0000000..175d8c2
--- /dev/null
+++ b/Resources/Private/Partials/Bullets/Type-1.fluid.html
@@ -0,0 +1,9 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:ce="http://typo3.org/ns/TYPO3/CMS/FluidStyledContent/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{bullets}">
+    <ol class="ce-bullets">
+    <f:for each="{bullets}" as="bullet">
+        <li>{bullet}</li>
+    </f:for>
+    </ol>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Bullets/Type-2.fluid.html b/Resources/Private/Partials/Bullets/Type-2.fluid.html
new file mode 100644
index 0000000..cb9d739
--- /dev/null
+++ b/Resources/Private/Partials/Bullets/Type-2.fluid.html
@@ -0,0 +1,18 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:ce="http://typo3.org/ns/TYPO3/CMS/FluidStyledContent/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{bullets}">
+    <dl class="ce-bullets">
+    <f:for each="{bullets}" as="definitionListItem">
+        <f:for each="{definitionListItem}" as="termDescription" iteration="termDescriptionIterator">
+            <f:if condition="{termDescriptionIterator.isFirst}">
+                <f:then>
+                    <dt>{termDescription}</dt>
+                </f:then>
+                <f:else>
+                    <dd>{termDescription}</dd>
+                </f:else>
+            </f:if>
+        </f:for>
+    </f:for>
+    </dl>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/DropIn/After/All.fluid.html b/Resources/Private/Partials/DropIn/After/All.fluid.html
new file mode 100644
index 0000000..38ef933
--- /dev/null
+++ b/Resources/Private/Partials/DropIn/After/All.fluid.html
@@ -0,0 +1,3 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:comment>DropIn Placeholder. Will be rendered after all other output inside the wrapping container.</f:comment>
+</html>
diff --git a/Resources/Private/Partials/DropIn/Before/All.fluid.html b/Resources/Private/Partials/DropIn/Before/All.fluid.html
new file mode 100644
index 0000000..8413eb5
--- /dev/null
+++ b/Resources/Private/Partials/DropIn/Before/All.fluid.html
@@ -0,0 +1,3 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:comment>DropIn Placeholder. Will be rendered before any other output inside the wrapping container.</f:comment>
+</html>
diff --git a/Resources/Private/Partials/Footer/All.fluid.html b/Resources/Private/Partials/Footer/All.fluid.html
new file mode 100644
index 0000000..20a9779
--- /dev/null
+++ b/Resources/Private/Partials/Footer/All.fluid.html
@@ -0,0 +1,7 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{data.linkToTop}">
+    <p>
+        <a href="#top"><f:translate key="toTop" extensionName="fluid_styled_content" /></a>
+    </p>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Header/All.fluid.html b/Resources/Private/Partials/Header/All.fluid.html
new file mode 100644
index 0000000..24dcc2a
--- /dev/null
+++ b/Resources/Private/Partials/Header/All.fluid.html
@@ -0,0 +1,24 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{data.header_layout} != 100">
+    <f:variable name="header">{record -> f:render.text(field: 'header', optional: true)}</f:variable>
+    <f:variable name="subheader">{record -> f:render.text(field: 'subheader', optional: true)}</f:variable>
+    <f:if condition="{header} || {subheader} || {data.date}">
+        <header>
+            <f:render partial="Header/Header" arguments="{
+                header: header,
+                layout: data.header_layout,
+                positionClass: '{f:if(condition: data.header_position, then: \'ce-headline-{data.header_position}\')}',
+                link: data.header_link,
+                default: settings.defaultHeaderType}" />
+            <f:render partial="Header/SubHeader" arguments="{
+                subheader: subheader,
+                layout: data.header_layout,
+                positionClass: '{f:if(condition: data.header_position, then: \'ce-headline-{data.header_position}\')}',
+                default: settings.defaultHeaderType}" />
+            <f:render partial="Header/Date" arguments="{
+                date: data.date,
+                positionClass: '{f:if(condition: data.header_position, then: \'ce-headline-{data.header_position}\')}'}" />
+        </header>
+    </f:if>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Header/Date.fluid.html b/Resources/Private/Partials/Header/Date.fluid.html
new file mode 100644
index 0000000..7c23ff0
--- /dev/null
+++ b/Resources/Private/Partials/Header/Date.fluid.html
@@ -0,0 +1,9 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{date}">
+    <p class="{positionClass}">
+        <time datetime="{date -> f:format.date(format: '%Y-%m-%d')}">
+            <f:format.date format="%B %e, %Y">{date}</f:format.date>
+        </time>
+    </p>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Header/Header.fluid.html b/Resources/Private/Partials/Header/Header.fluid.html
new file mode 100644
index 0000000..c7d8dd8
--- /dev/null
+++ b/Resources/Private/Partials/Header/Header.fluid.html
@@ -0,0 +1,48 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{header}">
+    <f:switch expression="{layout}">
+        <f:case value="1">
+            <h1 class="{positionClass}">
+                <f:link.typolink parameter="{link}">{header}</f:link.typolink>
+            </h1>
+        </f:case>
+        <f:case value="2">
+            <h2 class="{positionClass}">
+                <f:link.typolink parameter="{link}">{header}</f:link.typolink>
+            </h2>
+        </f:case>
+        <f:case value="3">
+            <h3 class="{positionClass}">
+                <f:link.typolink parameter="{link}">{header}</f:link.typolink>
+            </h3>
+        </f:case>
+        <f:case value="4">
+            <h4 class="{positionClass}">
+                <f:link.typolink parameter="{link}">{header}</f:link.typolink>
+            </h4>
+        </f:case>
+        <f:case value="5">
+            <h5 class="{positionClass}">
+                <f:link.typolink parameter="{link}">{header}</f:link.typolink>
+            </h5>
+        </f:case>
+        <f:case value="6">
+            <h6 class="{positionClass}">
+                <f:link.typolink parameter="{link}">{header}</f:link.typolink>
+            </h6>
+        </f:case>
+        <f:case value="100">
+            <f:comment> -- do not show header -- </f:comment>
+        </f:case>
+        <f:defaultCase>
+            <f:if condition="{default}">
+                <f:render partial="Header/Header" arguments="{
+                    header: header,
+                    layout: default,
+                    positionClass: positionClass,
+                    link: link}" />
+            </f:if>
+        </f:defaultCase>
+    </f:switch>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Header/SubHeader.fluid.html b/Resources/Private/Partials/Header/SubHeader.fluid.html
new file mode 100644
index 0000000..bbcfdd0
--- /dev/null
+++ b/Resources/Private/Partials/Header/SubHeader.fluid.html
@@ -0,0 +1,39 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{subheader}">
+    <f:switch expression="{layout}">
+        <f:case value="1">
+            <h2 class="{positionClass}">
+                {subheader}
+            </h2>
+        </f:case>
+        <f:case value="2">
+            <h3 class="{positionClass}">
+                {subheader}
+            </h3>
+        </f:case>
+        <f:case value="3">
+            <h4 class="{positionClass}">
+                {subheader}
+            </h4>
+        </f:case>
+        <f:case value="4">
+            <h5 class="{positionClass}">
+                {subheader}
+            </h5>
+        </f:case>
+        <f:case value="5">
+            <h6 class="{positionClass}">
+                {subheader}
+            </h6>
+        </f:case>
+        <f:defaultCase>
+            <f:if condition="{default}">
+                <f:render partial="Header/SubHeader" arguments="{
+                    subheader: subheader,
+                    positionClass: positionClass,
+                    layout: default}" />
+            </f:if>
+        </f:defaultCase>
+    </f:switch>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Media/Gallery.fluid.html b/Resources/Private/Partials/Media/Gallery.fluid.html
new file mode 100644
index 0000000..224735a
--- /dev/null
+++ b/Resources/Private/Partials/Media/Gallery.fluid.html
@@ -0,0 +1,25 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:ce="http://typo3.org/ns/TYPO3/CMS/FluidStyledContent/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{gallery.rows}">
+    <div class="ce-gallery{f:if(condition: data.imageborder, then: ' ce-border')}" data-ce-columns="{gallery.count.columns}" data-ce-images="{gallery.count.files}">
+        <f:if condition="{gallery.position.horizontal} == 'center'">
+            <div class="ce-outer">
+                <div class="ce-inner">
+        </f:if>
+        <f:for each="{gallery.rows}" as="row">
+            <div class="ce-row">
+                <f:for each="{row.columns}" as="column">
+                    <f:if condition="{column.media}">
+                        <div class="ce-column">
+                            <f:render partial="Media/Type" arguments="{file: column.media, dimensions: column.dimensions, data: data, settings: settings}" />
+                        </div>
+                    </f:if>
+                </f:for>
+            </div>
+        </f:for>
+        <f:if condition="{gallery.position.horizontal} == 'center'">
+                </div>
+            </div>
+        </f:if>
+    </div>
+</f:if>
+</html>
diff --git a/Resources/Private/Partials/Media/Rendering/Audio.fluid.html b/Resources/Private/Partials/Media/Rendering/Audio.fluid.html
new file mode 100644
index 0000000..7ba0e35
--- /dev/null
+++ b/Resources/Private/Partials/Media/Rendering/Audio.fluid.html
@@ -0,0 +1,3 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:media class="audio-embed-item" file="{file}" width="{dimensions.width}" height="{dimensions.height}" alt="{file.alternative}" title="{file.title}" />
+</html>
diff --git a/Resources/Private/Partials/Media/Rendering/Image.fluid.html b/Resources/Private/Partials/Media/Rendering/Image.fluid.html
new file mode 100644
index 0000000..1ecec10
--- /dev/null
+++ b/Resources/Private/Partials/Media/Rendering/Image.fluid.html
@@ -0,0 +1,3 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:media class="image-embed-item" file="{file}" width="{dimensions.width}" height="{dimensions.height}" alt="{file.alternative}" title="{file.title}" loading="{settings.media.lazyLoading}" decoding="{settings.media.imageDecoding}" />
+</html>
diff --git a/Resources/Private/Partials/Media/Rendering/Video.fluid.html b/Resources/Private/Partials/Media/Rendering/Video.fluid.html
new file mode 100644
index 0000000..1ecbd15
--- /dev/null
+++ b/Resources/Private/Partials/Media/Rendering/Video.fluid.html
@@ -0,0 +1,3 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:media class="video-embed-item" file="{file}" width="{dimensions.width}" height="{dimensions.height}" alt="{file.alternative}" title="{file.title}" additionalConfig="{settings.media.additionalConfig}" />
+</html>
diff --git a/Resources/Private/Partials/Media/Type.fluid.html b/Resources/Private/Partials/Media/Type.fluid.html
new file mode 100644
index 0000000..a60dd3a
--- /dev/null
+++ b/Resources/Private/Partials/Media/Type.fluid.html
@@ -0,0 +1,13 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:switch expression="{file.type}">
+    <f:case value="3">
+        <f:render partial="Media/Type/Audio" arguments="{file: file, dimensions: dimensions, data: data, settings: settings}" />
+    </f:case>
+    <f:case value="4">
+        <f:render partial="Media/Type/Video" arguments="{file: file, dimensions: dimensions, data: data, settings: settings}" />
+    </f:case>
+    <f:defaultCase>
+        <f:render partial="Media/Type/Image" arguments="{file: file, dimensions: dimensions, data: data, settings: settings}" />
+    </f:defaultCase>
+</f:switch>
+</html>
diff --git a/Resources/Private/Partials/Media/Type/Audio.fluid.html b/Resources/Private/Partials/Media/Type/Audio.fluid.html
new file mode 100644
index 0000000..5dd4638
--- /dev/null
+++ b/Resources/Private/Partials/Media/Type/Audio.fluid.html
@@ -0,0 +1,12 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<figure class="audio">
+    <div class="audio-embed">
+        <f:render partial="Media/Rendering/Audio" arguments="{file: file, dimensions: dimensions, settings: settings}" />
+    </div>
+    <f:if condition="{file.description}">
+        <figcaption class="audio-caption">
+            {file.description -> f:format.nl2br()}
+        </figcaption>
+    </f:if>
+</figure>
+</html>
diff --git a/Resources/Private/Partials/Media/Type/Image.fluid.html b/Resources/Private/Partials/Media/Type/Image.fluid.html
new file mode 100644
index 0000000..a5145f9
--- /dev/null
+++ b/Resources/Private/Partials/Media/Type/Image.fluid.html
@@ -0,0 +1,28 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:ce="http://typo3.org/ns/TYPO3/CMS/FluidStyledContent/ViewHelpers" data-namespace-typo3-fluid="true">
+<figure class="image">
+    <f:if condition="{file.link}">
+        <f:then>
+            <f:link.typolink parameter="{file.link}" title="{file.title}">
+                <f:render partial="Media/Rendering/Image" arguments="{file: file, dimensions: dimensions, settings: settings}" />
+            </f:link.typolink>
+        </f:then>
+        <f:else>
+            <f:if condition="{data.image_zoom}">
+                <f:then>
+                    <ce:link.clickEnlarge image="{file}" configuration="{settings.media.popup}">
+                        <f:render partial="Media/Rendering/Image" arguments="{file: file, dimensions: dimensions, settings: settings}" />
+                    </ce:link.clickEnlarge>
+                </f:then>
+                <f:else>
+                    <f:render partial="Media/Rendering/Image" arguments="{file: file, dimensions: dimensions, settings: settings}" />
+                </f:else>
+            </f:if>
+        </f:else>
+    </f:if>
+    <f:if condition="{file.description}">
+        <figcaption class="image-caption">
+            {file.description -> f:format.nl2br()}
+        </figcaption>
+    </f:if>
+</figure>
+</html>
diff --git a/Resources/Private/Partials/Media/Type/Video.fluid.html b/Resources/Private/Partials/Media/Type/Video.fluid.html
new file mode 100644
index 0000000..265242f
--- /dev/null
+++ b/Resources/Private/Partials/Media/Type/Video.fluid.html
@@ -0,0 +1,12 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<figure class="video">
+    <div class="video-embed">
+        <f:render partial="Media/Rendering/Video" arguments="{file: file, dimensions: dimensions, settings: settings}" />
+    </div>
+    <f:if condition="{file.description}">
+        <figcaption class="video-caption">
+            {file.description -> f:format.nl2br()}
+        </figcaption>
+    </f:if>
+</figure>
+</html>
diff --git a/Resources/Private/Partials/Table/Columns.fluid.html b/Resources/Private/Partials/Table/Columns.fluid.html
new file mode 100644
index 0000000..6248f31
--- /dev/null
+++ b/Resources/Private/Partials/Table/Columns.fluid.html
@@ -0,0 +1,98 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{rowIterator.isFirst}">
+    <f:then>
+        <f:if condition="{data.table_header_position} == 1">
+            <f:then>
+                <th>
+            </f:then>
+            <f:else>
+                <f:if condition="{columnIterator.isFirst}">
+                    <f:then>
+                        <f:if condition="{data.table_header_position} == 2">
+                            <f:then>
+                                <th>
+                            </f:then>
+                            <f:else>
+                                <td>
+                            </f:else>
+                        </f:if>
+                    </f:then>
+                    <f:else>
+                        <td>
+                    </f:else>
+                </f:if>
+            </f:else>
+        </f:if>
+    </f:then>
+    <f:else>
+        <f:if condition="{columnIterator.isFirst}">
+            <f:then>
+                <f:if condition="{data.table_header_position} == 2">
+                    <f:then>
+                        <th>
+                    </f:then>
+                    <f:else>
+                        <td>
+                    </f:else>
+                </f:if>
+            </f:then>
+            <f:else>
+                <td>
+            </f:else>
+        </f:if>
+    </f:else>
+</f:if>
+
+<f:if condition="{cell} != ''">
+    <f:then>
+        {cell -> f:format.nl2br()}
+    </f:then>
+    <f:else>
+        &nbsp;
+    </f:else>
+</f:if>
+
+<f:if condition="{rowIterator.isFirst}">
+    <f:then>
+        <f:if condition="{data.table_header_position} == 1">
+            <f:then>
+                </th>
+            </f:then>
+            <f:else>
+                <f:if condition="{columnIterator.isFirst}">
+                    <f:then>
+                        <f:if condition="{data.table_header_position} == 2">
+                            <f:then>
+                                </th>
+                            </f:then>
+                            <f:else>
+                                </td>
+                            </f:else>
+                        </f:if>
+                    </f:then>
+                    <f:else>
+                        </td>
+                    </f:else>
+                </f:if>
+            </f:else>
+        </f:if>
+    </f:then>
+    <f:else>
+        <f:if condition="{columnIterator.isFirst}">
+            <f:then>
+                <f:if condition="{data.table_header_position} == 2">
+                    <f:then>
+                        </th>
+                    </f:then>
+                    <f:else>
+                        </td>
+                    </f:else>
+                </f:if>
+            </f:then>
+            <f:else>
+                </td>
+            </f:else>
+        </f:if>
+    </f:else>
+</f:if>
+</html>
diff --git a/Resources/Private/Templates/Bullets.fluid.html b/Resources/Private/Templates/Bullets.fluid.html
new file mode 100644
index 0000000..149f92a
--- /dev/null
+++ b/Resources/Private/Templates/Bullets.fluid.html
@@ -0,0 +1,8 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:render partial="Bullets/Type-{data.bullets_type}" arguments="{_all}" />
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Div.fluid.html b/Resources/Private/Templates/Div.fluid.html
new file mode 100644
index 0000000..abc68d3
--- /dev/null
+++ b/Resources/Private/Templates/Div.fluid.html
@@ -0,0 +1,9 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Header" />
+<f:section name="Main">
+
+    <hr class="ce-div" />
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Generic.fluid.html b/Resources/Private/Templates/Generic.fluid.html
new file mode 100644
index 0000000..2c97f17
--- /dev/null
+++ b/Resources/Private/Templates/Generic.fluid.html
@@ -0,0 +1,12 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:comment>This templates is used to provide necessary functionality for external processed content and could be used across multiple sources, for example the frontend login content element.</f:comment>
+    <f:if condition="{content}">
+        <f:then>{content -> f:format.raw()}</f:then>
+        <f:else><f:cObject typoscriptObjectPath="tt_content.{data.CType}.20" data="{data}" table="tt_content" /></f:else>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Header.fluid.html b/Resources/Private/Templates/Header.fluid.html
new file mode 100644
index 0000000..3db31a8
--- /dev/null
+++ b/Resources/Private/Templates/Header.fluid.html
@@ -0,0 +1,3 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+</html>
diff --git a/Resources/Private/Templates/Html.fluid.html b/Resources/Private/Templates/Html.fluid.html
new file mode 100644
index 0000000..22fe35a
--- /dev/null
+++ b/Resources/Private/Templates/Html.fluid.html
@@ -0,0 +1,9 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Header" />
+<f:section name="Main">
+
+    <f:format.raw>{data.bodytext}</f:format.raw>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Image.fluid.html b/Resources/Private/Templates/Image.fluid.html
new file mode 100644
index 0000000..cbef074
--- /dev/null
+++ b/Resources/Private/Templates/Image.fluid.html
@@ -0,0 +1,10 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <div class="ce-image ce-{gallery.position.horizontal} ce-{gallery.position.vertical}">
+        <f:render partial="Media/Gallery" arguments="{_all}" />
+    </div>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuAbstract.fluid.html b/Resources/Private/Templates/MenuAbstract.fluid.html
new file mode 100644
index 0000000..2a281c6
--- /dev/null
+++ b/Resources/Private/Templates/MenuAbstract.fluid.html
@@ -0,0 +1,21 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                    <f:if condition="{page.data.abstract}">
+                        <f:format.html>{page.data.abstract}</f:format.html>
+                    </f:if>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuCategorizedContent.fluid.html b/Resources/Private/Templates/MenuCategorizedContent.fluid.html
new file mode 100644
index 0000000..155946c
--- /dev/null
+++ b/Resources/Private/Templates/MenuCategorizedContent.fluid.html
@@ -0,0 +1,18 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{content}">
+        <ul>
+            <f:for each="{content}" as="element">
+                <li>
+                    <f:link.page pageUid="{element.data.pid}" section="{element.data.uid}" title="{element.data.header}">
+                        <span>{element.data.header}</span>
+                    </f:link.page>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuCategorizedPages.fluid.html b/Resources/Private/Templates/MenuCategorizedPages.fluid.html
new file mode 100644
index 0000000..1be9534
--- /dev/null
+++ b/Resources/Private/Templates/MenuCategorizedPages.fluid.html
@@ -0,0 +1,18 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuPages.fluid.html b/Resources/Private/Templates/MenuPages.fluid.html
new file mode 100644
index 0000000..40bf9e3
--- /dev/null
+++ b/Resources/Private/Templates/MenuPages.fluid.html
@@ -0,0 +1,17 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuRecentlyUpdated.fluid.html b/Resources/Private/Templates/MenuRecentlyUpdated.fluid.html
new file mode 100644
index 0000000..1be9534
--- /dev/null
+++ b/Resources/Private/Templates/MenuRecentlyUpdated.fluid.html
@@ -0,0 +1,18 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuRelatedPages.fluid.html b/Resources/Private/Templates/MenuRelatedPages.fluid.html
new file mode 100644
index 0000000..1be9534
--- /dev/null
+++ b/Resources/Private/Templates/MenuRelatedPages.fluid.html
@@ -0,0 +1,18 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuSection.fluid.html b/Resources/Private/Templates/MenuSection.fluid.html
new file mode 100644
index 0000000..e77dac1
--- /dev/null
+++ b/Resources/Private/Templates/MenuSection.fluid.html
@@ -0,0 +1,31 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                    <f:if condition="{page.content}">
+                        <ul>
+                            <f:for each="{page.content}" as="element">
+                                <f:if condition="{element.data.header}">
+                                <li>
+                                    <a href="{page.link}#c{element.data.uid}"{f:if(condition: page.target, then: ' target="{page.target}"')} title="{element.data.header}">
+                                        <span>{element.data.header}</span>
+                                    </a>
+                                </li>
+                                </f:if>
+                            </f:for>
+                        </ul>
+                    </f:if>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuSectionPages.fluid.html b/Resources/Private/Templates/MenuSectionPages.fluid.html
new file mode 100644
index 0000000..bb51d2e
--- /dev/null
+++ b/Resources/Private/Templates/MenuSectionPages.fluid.html
@@ -0,0 +1,29 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                    <f:if condition="{page.content}">
+                        <ul>
+                            <f:for each="{page.content}" as="element">
+                                <li>
+                                    <a href="{page.link}#c{element.data.uid}"{f:if(condition: page.target, then: ' target="{page.target}"')} title="{element.data.header}">
+                                        <span>{element.data.header}</span>
+                                    </a>
+                                </li>
+                            </f:for>
+                        </ul>
+                    </f:if>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuSitemap.fluid.html b/Resources/Private/Templates/MenuSitemap.fluid.html
new file mode 100644
index 0000000..6ed5315
--- /dev/null
+++ b/Resources/Private/Templates/MenuSitemap.fluid.html
@@ -0,0 +1,24 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:render section="Menu" arguments="{menu: menu}" />
+
+</f:section>
+<f:section name="Menu">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                    <f:render section="Menu" arguments="{menu: page.children}" />
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuSitemapPages.fluid.html b/Resources/Private/Templates/MenuSitemapPages.fluid.html
new file mode 100644
index 0000000..6ed5315
--- /dev/null
+++ b/Resources/Private/Templates/MenuSitemapPages.fluid.html
@@ -0,0 +1,24 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:render section="Menu" arguments="{menu: menu}" />
+
+</f:section>
+<f:section name="Menu">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                    <f:render section="Menu" arguments="{menu: page.children}" />
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/MenuSubpages.fluid.html b/Resources/Private/Templates/MenuSubpages.fluid.html
new file mode 100644
index 0000000..1be9534
--- /dev/null
+++ b/Resources/Private/Templates/MenuSubpages.fluid.html
@@ -0,0 +1,18 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{menu}">
+        <ul>
+            <f:for each="{menu}" as="page">
+                <li>
+                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
+                        <span>{page.title}</span>
+                    </a>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Shortcut.fluid.html b/Resources/Private/Templates/Shortcut.fluid.html
new file mode 100644
index 0000000..78f4b8a
--- /dev/null
+++ b/Resources/Private/Templates/Shortcut.fluid.html
@@ -0,0 +1,9 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Header" />
+<f:section name="Main">
+
+    <f:format.raw>{shortcuts}</f:format.raw>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Table.fluid.html b/Resources/Private/Templates/Table.fluid.html
new file mode 100644
index 0000000..666be6c
--- /dev/null
+++ b/Resources/Private/Templates/Table.fluid.html
@@ -0,0 +1,62 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{table}">
+        <table class="ce-table{f:if(condition: data.table_class, then: ' ce-table-{data.table_class}')}">
+            <f:variable name="table_caption">{record -> f:render.text(field:'table_caption')}</f:variable>
+            <f:if condition="{table_caption}">
+                <caption>{table_caption}</caption>
+            </f:if>
+            <f:for each="{table}" as="row" iteration="rowIterator">
+                <f:if condition="{rowIterator.isFirst}">
+                    <f:then>
+                        <f:if condition="{data.table_header_position} == 1">
+                            <f:then>
+                                <thead>
+                            </f:then>
+                            <f:else>
+                                <tbody>
+                            </f:else>
+                        </f:if>
+                    </f:then>
+                    <f:else>
+                        <f:if condition="{rowIterator.isLast}">
+                            <f:if condition="{data.table_tfoot}">
+                                </tbody>
+                                <tfoot>
+                            </f:if>
+                        </f:if>
+                    </f:else>
+                </f:if>
+                <tr>
+                    <f:for each="{row}" as="cell" iteration="columnIterator">
+                        <f:render partial="Table/Columns" arguments="{_all}" />
+                    </f:for>
+                </tr>
+                <f:if condition="{rowIterator.isFirst}">
+                    <f:then>
+                        <f:if condition="{data.table_header_position} == 1">
+                            </thead>
+                            <tbody>
+                        </f:if>
+                    </f:then>
+                    <f:else>
+                        <f:if condition="{rowIterator.isLast}">
+                            <f:if condition="{data.table_tfoot}">
+                                <f:then>
+                                    </tfoot>
+                                </f:then>
+                                <f:else>
+                                    </tbody>
+                                </f:else>
+                            </f:if>
+                        </f:if>
+                    </f:else>
+                </f:if>
+            </f:for>
+        </table>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Text.fluid.html b/Resources/Private/Templates/Text.fluid.html
new file mode 100644
index 0000000..9a34528
--- /dev/null
+++ b/Resources/Private/Templates/Text.fluid.html
@@ -0,0 +1,8 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    {record -> f:render.text(field: 'bodytext')}
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Textmedia.fluid.html b/Resources/Private/Templates/Textmedia.fluid.html
new file mode 100644
index 0000000..40b84cf
--- /dev/null
+++ b/Resources/Private/Templates/Textmedia.fluid.html
@@ -0,0 +1,45 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Header">
+
+    <f:if condition="{gallery.position.noWrap} != 1">
+        <f:render partial="Header/All" arguments="{_all}" />
+    </f:if>
+
+</f:section>
+<f:section name="Main">
+
+    <div class="ce-textpic ce-{gallery.position.horizontal} ce-{gallery.position.vertical}{f:if(condition: gallery.position.noWrap, then: ' ce-nowrap')}">
+        <f:if condition="{gallery.position.vertical} != 'below'">
+            <f:render partial="Media/Gallery" arguments="{_all}" />
+        </f:if>
+
+        <f:variable name="bodytext">{record -> f:render.text(field: 'bodytext')}</f:variable>
+        <f:if condition="{bodytext}">
+            <f:then>
+                <div class="ce-bodytext">
+                    <f:if condition="{gallery.position.noWrap}">
+                        <f:render partial="Header/All" arguments="{_all}" />
+                    </f:if>
+                    {bodytext}
+                </div>
+            </f:then>
+            <f:else>
+                <f:if condition="{gallery.position.noWrap}">
+                    <f:variable name="header">{record -> f:render.text(field: 'header')}</f:variable>
+                    <f:if condition="{header}">
+                        <div class="ce-bodytext">
+                            <f:render partial="Header/All" arguments="{_all}" />
+                        </div>
+                    </f:if>
+                </f:if>
+            </f:else>
+        </f:if>
+
+        <f:if condition="{gallery.position.vertical} == 'below'">
+            <f:render partial="Media/Gallery" arguments="{_all}" />
+        </f:if>
+    </div>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Textpic.fluid.html b/Resources/Private/Templates/Textpic.fluid.html
new file mode 100644
index 0000000..40b84cf
--- /dev/null
+++ b/Resources/Private/Templates/Textpic.fluid.html
@@ -0,0 +1,45 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Header">
+
+    <f:if condition="{gallery.position.noWrap} != 1">
+        <f:render partial="Header/All" arguments="{_all}" />
+    </f:if>
+
+</f:section>
+<f:section name="Main">
+
+    <div class="ce-textpic ce-{gallery.position.horizontal} ce-{gallery.position.vertical}{f:if(condition: gallery.position.noWrap, then: ' ce-nowrap')}">
+        <f:if condition="{gallery.position.vertical} != 'below'">
+            <f:render partial="Media/Gallery" arguments="{_all}" />
+        </f:if>
+
+        <f:variable name="bodytext">{record -> f:render.text(field: 'bodytext')}</f:variable>
+        <f:if condition="{bodytext}">
+            <f:then>
+                <div class="ce-bodytext">
+                    <f:if condition="{gallery.position.noWrap}">
+                        <f:render partial="Header/All" arguments="{_all}" />
+                    </f:if>
+                    {bodytext}
+                </div>
+            </f:then>
+            <f:else>
+                <f:if condition="{gallery.position.noWrap}">
+                    <f:variable name="header">{record -> f:render.text(field: 'header')}</f:variable>
+                    <f:if condition="{header}">
+                        <div class="ce-bodytext">
+                            <f:render partial="Header/All" arguments="{_all}" />
+                        </div>
+                    </f:if>
+                </f:if>
+            </f:else>
+        </f:if>
+
+        <f:if condition="{gallery.position.vertical} == 'below'">
+            <f:render partial="Media/Gallery" arguments="{_all}" />
+        </f:if>
+    </div>
+
+</f:section>
+</html>
diff --git a/Resources/Private/Templates/Uploads.fluid.html b/Resources/Private/Templates/Uploads.fluid.html
new file mode 100644
index 0000000..f068721
--- /dev/null
+++ b/Resources/Private/Templates/Uploads.fluid.html
@@ -0,0 +1,45 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Main">
+
+    <f:if condition="{files}">
+        <ul class="ce-uploads">
+            <f:for each="{files}" as="file" iteration="fileIterator">
+                <li>
+                    <f:if condition="{data.uploads_type} == 1">
+                        <img src="{f:uri.resource(path: 'EXT:frontend/Resources/Public/Icons/FileIcons/{file.extension}.gif')}" alt="">
+                    </f:if>
+                    <f:if condition="{data.uploads_type} == 2">
+                        <f:if condition="{file.type} > 1">
+                            <f:if condition="{f:uri.image(src: 'file:{f:if(condition: file.originalFile, then: \'file:{file.originalFile.uid}\', else: \'file:{file.uid}\')}')} != '/'">
+                                <f:then>
+                                    <a href="{file.publicUrl}" {f:if(condition:data.target,then: ' target="{data.target}"')}{f:if(condition: file.title, then: ' title="{file.title}"')}>
+                                        <f:media file="{file}" width="150" alt="{file.properties.alternative}" />
+                                    </a>
+                                </f:then>
+                                <f:else>
+                                    <img src="{f:uri.resource(path: 'EXT:frontend/Resources/Public/Icons/FileIcons/{file.extension}.gif')}" alt="">
+                                </f:else>
+                            </f:if>
+                        </f:if>
+                    </f:if>
+                    <div>
+                        <a href="{file.publicUrl}" {f:if(condition:data.target,then: ' target="{data.target}"')}{f:if(condition: file.title, then: ' title="{file.title}"')}>
+                            <span class="ce-uploads-fileName">{f:if(condition: file.properties.title, then: file.properties.title, else: file.name) -> f:format.htmlspecialchars()}</span>
+                        </a>
+                        <f:if condition="{file.properties.description}">
+                            <f:if condition="{data.uploads_description}">
+                                <span class="ce-uploads-description">{file.properties.description}</span>
+                            </f:if>
+                        </f:if>
+                        <f:if condition="{data.filelink_size}">
+                            <span class="ce-uploads-filesize"><f:format.bytes value="{file.properties.size}" /></span>
+                        </f:if>
+                    </div>
+                </li>
+            </f:for>
+        </ul>
+    </f:if>
+
+</f:section>
+</html>
diff --git a/Resources/Public/Icons/Extension.svg b/Resources/Public/Icons/Extension.svg
new file mode 100644
index 0000000..bca7a17
--- /dev/null
+++ b/Resources/Public/Icons/Extension.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="#FF8700" d="M0 0h64v64H0z"/><path fill="#FFF" d="M42.8 32.8c-3.6 0-8.1-10.1-8.1-15.1 0-2.3.9-2.7 3.2-2.7 5.5 0 11 .9 11 4-.1 6.2-4 13.8-6.1 13.8zM28.5 18.5c0 5 6.4 20.2 10.7 20.2.5 0 .9-.1 1.4-.2-3.8 6.1-8.4 10.6-11.2 10.6-5.9 0-14.3-17.9-14.3-25.7 0-1.2.3-2.2.7-2.8 2-2.5 8.4-4.4 13.7-5-.6.4-1 1-1 2.9z"/></svg>
\ No newline at end of file
diff --git a/composer.json b/composer.json
new file mode 100644
index 0000000..68dab59
--- /dev/null
+++ b/composer.json
@@ -0,0 +1,58 @@
+{
+	"name": "typo3/cms-fluid-styled-content",
+	"type": "typo3-cms-framework",
+	"description": "TYPO3 CMS Fluid Styled Content - Fluid templates for TYPO3 content elements.",
+	"homepage": "https://typo3.community/",
+	"funding": [
+		{
+			"type": "membership",
+			"url": "https://typo3.org/membership"
+		}
+	],
+	"license": [
+		"GPL-2.0-or-later"
+	],
+	"authors": [
+		{
+			"name": "TYPO3 Core Team",
+			"email": "typo3cms@typo3.org",
+			"role": "Developer"
+		}
+	],
+	"support": {
+		"issues": "https://forge.typo3.org/issues/",
+		"forum": "https://talk.typo3.org/",
+		"source": "https://github.com/TYPO3/typo3/",
+		"docs": "https://docs.typo3.org/c/typo3/cms-fluid-styled-content/main/en-us/",
+		"rss": "https://news.typo3.com/rss/",
+		"chat": "https://typo3.community/meet/slack/",
+		"security": "https://typo3.org/security/"
+	},
+	"config": {
+		"sort-packages": true
+	},
+	"require": {
+		"typo3/cms-core": "15.0.*@dev",
+		"typo3/cms-fluid": "15.0.*@dev",
+		"typo3/cms-frontend": "15.0.*@dev"
+	},
+	"conflict": {
+		"typo3/cms": "*"
+	},
+	"extra": {
+		"branch-alias": {
+			"dev-main": "15.0.x-dev"
+		},
+		"typo3/cms": {
+			"Package": {
+				"partOfFactoryDefault": true
+			},
+			"extension-key": "fluid_styled_content"
+		}
+	},
+	"autoload": {
+		"psr-4": {
+			"TYPO3\\CMS\\FluidStyledContent\\": "Classes/"
+		}
+	}
+}
diff --git a/ext_localconf.php b/ext_localconf.php
new file mode 100644
index 0000000..22498d5
--- /dev/null
+++ b/ext_localconf.php
@@ -0,0 +1,8 @@
+<?php
+
+declare(strict_types=1);
+
+defined('TYPO3') or die();
+
+// Define TypoScript as content rendering template
+$GLOBALS['TYPO3_CONF_VARS']['FE']['contentRenderingTemplates'][] = 'fluidstyledcontent/Configuration/TypoScript/';