diff --git a/source/_patterns/02-organisms/08-event-feed/event-feed.mustache b/source/_patterns/02-organisms/08-event-feed/event-feed.mustache
index ed5a415e306e4e33f25a6f6d1037e3516727f87f..b70a12d59b86a69973f642de5bbf7ff251542b3c 100644
--- a/source/_patterns/02-organisms/08-event-feed/event-feed.mustache
+++ b/source/_patterns/02-organisms/08-event-feed/event-feed.mustache
@@ -16,7 +16,7 @@
         </div>
       {{/ withActionMenu }}
     </div>
-    <span class="leading-tight">{{ excerpt.short }}</span>
+    <span class="leading-tight text-sm lg:text-base">{{ excerpt.short }}</span>
   </div>
   <div class="bg-opacity-50 bg-yellow-100 border-green-400 border-l-2 {{ itemPadding }}{{^ itemPadding }}p-3{{/ itemPadding }}">
     <div class="flex items-center justify-between mb-2">
@@ -35,7 +35,7 @@
         </div>
       {{/ withActionMenu }}
     </div>
-    <span class="leading-tight">{{ excerpt.short }}</span>
+    <span class="leading-tight text-sm lg:text-base">{{ excerpt.short }}</span>
   </div>
   <div class="bg-grey-50 bg-opacity-50 border-blue-300 border-l-2 {{ itemPadding }}{{^ itemPadding }}p-3{{/ itemPadding }}">
     <div class="flex items-center justify-between mb-2">
@@ -57,7 +57,7 @@
         </div>
       {{/ withActionMenu }}
     </div>
-    <span class="leading-tight">{{ excerpt.short }}</span>
+    <span class="leading-tight text-sm lg:text-base">{{ excerpt.short }}</span>
   </div>
   <div class="bg-grey-50 bg-opacity-50 border-red-600 border-l-2 {{ itemPadding }}{{^ itemPadding }}p-3{{/ itemPadding }}">
     <div class="flex items-center justify-between mb-2">
@@ -80,7 +80,7 @@
         </div>
       {{/ withActionMenu }}
     </div>
-    <span class="leading-tight mb-2">{{ excerpt.short }}</span>
+    <span class="leading-tight text-sm lg:text-base">{{ excerpt.short }}</span>
   </div>
   <div class="bg-grey-50 bg-opacity-50 border-cyan-500 border-l-2 {{ itemPadding }}{{^ itemPadding }}p-3{{/ itemPadding }}">
     <div class="flex items-center justify-between mb-2">
@@ -102,7 +102,7 @@
         </div>
       {{/ withActionMenu }}
     </div>
-    <span class="leading-tight">{{ excerpt.short }}</span>
+    <span class="leading-tight text-sm lg:text-base">{{ excerpt.short }}</span>
   </div>
   <div class="bg-grey-50 bg-opacity-50 border-orange-300 border-l-2 {{ itemPadding }}{{^ itemPadding }}p-3{{/ itemPadding }}">
     <div class="flex items-center justify-between mb-2">
@@ -121,7 +121,7 @@
         </div>
       {{/ withActionMenu }}
     </div>
-    <span class="leading-tight">{{ excerpt.short }}</span>
+    <span class="leading-tight text-sm lg:text-base">{{ excerpt.short }}</span>
   </div>
   <div class="bg-grey-50 bg-opacity-50 border-black border-l-2 {{ itemPadding }}{{^ itemPadding }}p-3{{/ itemPadding }}">
     <div class="flex items-center justify-between mb-2">
@@ -140,6 +140,6 @@
         </div>
       {{/ withActionMenu }}
     </div>
-    <span class="leading-tight"><strong>{{ person.first }} {{ person.last }}</strong> byl zablokován.</span>
+    <span class="leading-tight text-sm lg:text-base"><strong>{{ person.first }} {{ person.last }}</strong> byl zablokován.</span>
   </div>
 </div>
diff --git a/source/_patterns/03-templates/cf2021/anonymous.mustache b/source/_patterns/03-templates/cf2021/anonymous.mustache
index b585ba8a70def2d3b3d9b5fe62508fdce286a474..e8680824111c73f4110ef6f26286de9a0e52bd89 100644
--- a/source/_patterns/03-templates/cf2021/anonymous.mustache
+++ b/source/_patterns/03-templates/cf2021/anonymous.mustache
@@ -1,187 +1,231 @@
 {{> organisms-simplified-navbar-with-actions }}
 
-<div class="container container--wide pt-8 lg:py-24">
-  <article>
-    <div class="grid grid-cols-3 gap-8">
-      <div class="col-span-2 space-y-8">
-        <div class="flex items-center justify-between mb-8">
-          <h1 class="head-alt-lg mb-0 pt-1 pr-8">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
-        </div>
-        <iframe width="100%" height="610" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+<article class="container container--wide pt-8 lg:py-24 cf2021">
+  <section class="cf2021__video space-y-8">
+    <div class="flex items-center justify-between mb-4 lg:mb-8">
+      <h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
+    </div>
+    <iframe width="100%" height="500" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+  </section>
 
-        <section>
-          <div class="flex justify-between items-center mb-4">
-            <h2 class="head-heavy-sm whitespace-no-wrap">Příspěvky v rozpravě</h2>
-            <div class="flex items-center">
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs">
-                <select>
-                  <option value="">Vše</option>
-                  <option value="">Jen aktivnĂ­</option>
-                  <option value="">Jen archivované</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1">
-                <select>
-                  <option value="">Podle ÄŤasu</option>
-                  <option value="">Podle podpory</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs mr-4 ml-1">
-                <select>
-                  <option value="">Návrhy i příspěvky</option>
-                  <option value="">Jen návrhy</option>
-                  <option value="">Jen příspěvky</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
+  <section class="cf2021__notifications">
+    <div class="lg:card lg:elevation-10">
+      <div class="lg:card__body pb-2 lg:py-6">
+        <h2 class="head-heavy-sm">Oznámení</h2>
+      </div>
 
-              {{> molecules-chip-pagination }}
-            </div>
-          </div>
+      <div class="container-padding--zero lg:container-padding--auto">
+        {{> organisms-event-feed(itemPadding: "px-4 py-2 lg:px-8 lg:py-3") }}
+      </div>
+    </div>
+  </section>
+
+  <section class="cf2021__posts">
+    <div class="flex flex-col xl:flex-row xl:justify-between xl:items-center mb-4">
+      <h2 class="head-heavy-sm whitespace-no-wrap">Příspěvky v rozpravě</h2>
+      <div class="flex flex-col space-y-2 xl:space-y-0 xl:space-x-8 xl:flex-row xl:items-center">
+        <div class="-mx-1">
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Vše</option>
+              <option value="">Jen aktivnĂ­</option>
+              <option value="">Jen archivované</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Podle ÄŤasu</option>
+              <option value="">Podle podpory</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Návrhy i příspěvky</option>
+              <option value="">Jen návrhy</option>
+              <option value="">Jen příspěvky</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+        </div>
 
-          <div class="space-y-6">
-            <div class="flex items-start bg-yellow-100 bg-opacity-50 p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:46</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                    </div>
-                    {{> molecules-thumbs }}
+        <div>
+          {{> molecules-chip-pagination }}
+        </div>
+      </div>
+    </div>
+
+    <div class="space-y-6 container-padding--zero lg:container-padding--auto">
+      <div class="flex items-start bg-yellow-100 bg-opacity-50 p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-xs lg:text-sm lg:ml-2">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-xs lg:text-sm">@ 11:46</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-xs lg:text-sm lg:ml-2">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-xs lg:text-sm">@ 11:42</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
-                      <a href="#" class="text-grey-200 text-xs ml-2 underline">(Upraveno přesdedajícím)</a>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-xs lg:text-sm lg:ml-2">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-xs lg:text-sm">@ 11:40</span>
+                    <a href="#" class="text-grey-200 text-xs ml-2 underline hidden md:inline">(Upraveno přesdedajícím)</a>
+                  </div>
+                  <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                    {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:38</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-xs lg:text-sm lg:ml-2">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:38</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--green-400 chip--condensed ml-2", cta: "Schválený")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-xs lg:text-sm lg:ml-2">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--green-400 chip--condensed ml-2", cta: "Schválený")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "ZamĂ­tnutĂ˝")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm lg:ml-2">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "ZamĂ­tnutĂ˝")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "Odmítnutý předsedajícím")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-xs lg:text-sm lg:ml-2">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "Odmítnutý předsedajícím")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
           </div>
-        </section>
-      </div>
-      <div>
-        <div class="lg:card lg:elevation-10">
-          <div class="lg:card__body lg:py-6">
-            <h2 class="head-heavy-sm">Oznámení</h2>
-          </div>
-
-          {{> organisms-event-feed(itemPadding: "px-8 py-3") }}
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
         </div>
       </div>
     </div>
-
-  </article>
-</div>
+  </section>
+</article>
diff --git a/source/_patterns/03-templates/cf2021/chairman.mustache b/source/_patterns/03-templates/cf2021/chairman.mustache
index 815a71ba319a8f347531b2a17234825366097fe1..9a80e7634d35d2997801a0eaa0ff71a51bc0531e 100644
--- a/source/_patterns/03-templates/cf2021/chairman.mustache
+++ b/source/_patterns/03-templates/cf2021/chairman.mustache
@@ -1,340 +1,389 @@
 {{> organisms-simplified-navbar-with-avatar }}
 
-<div class="container container--wide pt-8 lg:py-24">
-  <article>
-    <div class="grid grid-cols-3 gap-8">
-      <div class="col-span-2 space-y-8">
-        <div class="flex items-start justify-between mb-8">
-          <h1 class="head-alt-lg mb-0 pt-1 pr-8">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
-          <div class="dropdown dropdown--right mt-4">
-            <i class="ico--dots-three-vertical cursor-pointer pl-2 text-lg"></i>
-            <ul class="dropdown__content whitespace-no-wrap">
-              <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                <a class="block px-3 py-3" href="#"><i class="ico--edit-pencil mr-2"></i>Přejmenovat bod programu</a>
-              </li>
-              <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                <a class="block px-3 py-3" href="#" id="js-end-discussion"><i class="ico--bubbles mr-2"></i>UkonÄŤit rozpravu</a>
-              </li>
-              <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                <a class="block px-3 py-3" href="#"><i class="ico--switch mr-2"></i>UkonÄŤit bod programu</a>
-              </li>
-            </ul>
-          </div>
-        </div>
+<article class="container container--wide pt-8 lg:py-24 cf2021">
+  <section class="cf2021__video space-y-8">
+    <div class="flex items-center justify-between mb-4 lg:mb-8">
+      <h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
+      <div class="dropdown dropdown--right mt-4">
+        <i class="ico--dots-three-vertical cursor-pointer pl-2 text-lg"></i>
+        <ul class="dropdown__content whitespace-no-wrap">
+          <li class="dropdown__content-item bg-white hover:bg-grey-125">
+            <a class="block px-3 py-3" href="#"><i class="ico--edit-pencil mr-2"></i>Přejmenovat bod programu</a>
+          </li>
+          <li class="dropdown__content-item bg-white hover:bg-grey-125">
+            <a class="block px-3 py-3" href="#" id="js-end-discussion"><i class="ico--bubbles mr-2"></i>UkonÄŤit rozpravu</a>
+          </li>
+          <li class="dropdown__content-item bg-white hover:bg-grey-125">
+            <a class="block px-3 py-3" href="#"><i class="ico--switch mr-2"></i>UkonÄŤit bod programu</a>
+          </li>
+        </ul>
+      </div>
+    </div>
 
-        <iframe width="100%" height="610" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+    <iframe width="100%" height="500" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+  </section>
 
-        <section>
-          <div class="flex justify-between items-center mb-4">
-            <h2 class="head-heavy-sm whitespace-no-wrap">Příspěvky v rozpravě</h2>
-            <div class="flex items-center">
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs">
-                <select>
-                  <option value="">Jen nezpracované</option>
-                  <option value="">Vše</option>
-                  <option value="">Jen aktivnĂ­</option>
-                  <option value="">Jen archivované</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1">
-                <select>
-                  <option value="">Podle ÄŤasu</option>
-                  <option value="">Podle podpory</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs mr-4 ml-1">
-                <select>
-                  <option value="">Návrhy i příspěvky</option>
-                  <option value="">Jen návrhy</option>
-                  <option value="">Jen příspěvky</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
+  <section class="cf2021__notifications">
+    <div class="lg:card lg:elevation-10">
+      <div class="lg:card__body pb-2 lg:py-6">
+        <h2 class="head-heavy-sm">Oznámení</h2>
+      </div>
 
-              {{> molecules-chip-pagination }}
-            </div>
-          </div>
+      <div class="container-padding--zero lg:container-padding--auto">
+        {{> organisms-event-feed(itemPadding: "px-4 py-2 lg:px-8 lg:py-3") }}
+      </div>
 
-          <div class="space-y-6">
-            <div class="flex items-start bg-yellow-100 bg-opacity-50 p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:46</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--eye-off text-2xs mr-1"></i>Skrýt příspěvek</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
+      <div class="lg:card__body pt-4 lg:py-6">
+        {{> molecules-textarea-field(nolabel: true, placeholder: "Vyplňte text oznámení", rows: 3) }}
+        {{> atoms-basic-button(cta: "Přidat oznámení", classes: "btn--black btn--hoveractive text-sm mt-2") }}
+      </div>
+    </div>
+  </section>
+
+  <section class="cf2021__posts">
+    <div class="flex flex-col xl:flex-row xl:justify-between xl:items-center mb-4">
+      <h2 class="head-heavy-sm whitespace-no-wrap">Příspěvky v rozpravě</h2>
+      <div class="flex flex-col space-y-2 xl:space-y-0 xl:space-x-8 xl:flex-row xl:items-center">
+        <div class="-mx-1">
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Jen nezpracované</option>
+              <option value="">Vše</option>
+              <option value="">Jen aktivnĂ­</option>
+              <option value="">Jen archivované</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Podle ÄŤasu</option>
+              <option value="">Podle podpory</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Návrhy i příspěvky</option>
+              <option value="">Jen návrhy</option>
+              <option value="">Jen příspěvky</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+        </div>
+
+        <div>
+          {{> molecules-chip-pagination }}
+        </div>
+      </div>
+    </div>
+
+    <div class="space-y-6 container-padding--zero lg:container-padding--auto">
+      <div class="flex items-start bg-yellow-100 bg-opacity-50 p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:46</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                </div>
               </div>
-            </div>
-            <div class="flex items-start p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--eye-off text-2xs mr-1"></i>Skrýt příspěvek</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
-                  </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--eye-off text-2xs mr-1"></i>Skrýt příspěvek</a>
+                    </li>
+                  </ul>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
               </div>
             </div>
-            <div class="flex items-start p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--grey-500 chip--condensed ml-2", cta: "Čeká na zpracování")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#" id="js-announce-proposal"><i class="ico--bullhorn mr-1"></i> Vyhlásit procedurální návrh</a>
-                          </li>
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--thumbs-down text-2xs mr-1"></i> Odmítnout procedurální návrh</a>
-                          </li>
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                </div>
               </div>
-            </div>
-
-            <div class="flex items-start p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
-                      <a href="#" class="text-grey-200 text-xs ml-2 underline">(Upraveno přesdedajícím)</a>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--blue-300 chip--condensed ml-2", cta: "Vyhlášený")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--thumbs-up text-2xs mr-1"></i> Schválit</a>
-                          </li>
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--thumbs-down text-2xs mr-1"></i> ZamĂ­tnout</a>
-                          </li>
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
-                  </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--eye-off text-2xs mr-1"></i>Skrýt příspěvek</a>
+                    </li>
+                  </ul>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
               </div>
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:38</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--eye-off text-2xs mr-1"></i>Skrýt příspěvek</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--grey-500 chip--condensed ml-2", cta: "Čeká na zpracování")}}
+                </div>
+              </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#" id="js-announce-proposal"><i class="ico--bullhorn mr-1"></i> Vyhlásit procedurální návrh</a>
+                    </li>
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--thumbs-down text-2xs mr-1"></i> Odmítnout procedurální návrh</a>
+                    </li>
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                  </ul>
+                </div>
               </div>
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--green-400 chip--condensed ml-2", cta: "Schválený")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
+                    <a href="#" class="text-grey-200 text-xs ml-2 underline">(Upraveno přesdedajícím)</a>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--blue-300 chip--condensed ml-2", cta: "Vyhlášený")}}
+                </div>
+              </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--thumbs-up text-2xs mr-1"></i> Schválit</a>
+                    </li>
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--thumbs-down text-2xs mr-1"></i> ZamĂ­tnout</a>
+                    </li>
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                  </ul>
+                </div>
               </div>
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "ZamĂ­tnutĂ˝")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:38</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
+              </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--eye-off text-2xs mr-1"></i>Skrýt příspěvek</a>
+                    </li>
+                  </ul>
+                </div>
               </div>
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "Odmítnutý předsedajícím")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    <div class="flex items-center space-x-4">
-                      {{> molecules-thumbs }}
-                      <div class="dropdown dropdown--right">
-                        <i class="ico--dots-three-vertical cursor-pointer"></i>
-                        <ul class="dropdown__content text-xs whitespace-no-wrap">
-                          <li class="dropdown__content-item bg-white hover:bg-grey-125">
-                            <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
-                          </li>
-                        </ul>
-                      </div>
-                    </div>
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--green-400 chip--condensed ml-2", cta: "Schválený")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
+              </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                  </ul>
+                </div>
               </div>
             </div>
           </div>
-
-          <div class="my-8 space-y-4">
-            {{> molecules-textarea-field(nolabel: true, placeholder: "Vyplňte text vašeho příspěvku", rows: 5) }}
-            <div class="space-x-4">
-              {{> molecules-dropdown-button(cta: "Přidat příspěvek") }}
-              <span class="text-sm text-grey-200">Pro pokročilejší formátování můžete používat <a href="#" class="underline">Markdown</a>.</span>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
+                  </div>
+                </div>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "ZamĂ­tnutĂ˝")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
+              </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
             </div>
           </div>
-        </section>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
       </div>
-      <div>
-        <div class="lg:card lg:elevation-10">
-          <div class="lg:card__body lg:py-6">
-            <h2 class="head-heavy-sm">Oznámení</h2>
-          </div>
-
-          {{> organisms-event-feed(withActionMenu: true, itemPadding: "px-8 py-3") }}
-
-          <div class="lg:card__body lg:py-6">
-            {{> molecules-textarea-field(nolabel: true, placeholder: "Vyplňte text oznámení", rows: 3) }}
-            {{> atoms-basic-button(cta: "Přidat oznámení", classes: "btn--black btn--hoveractive text-sm mt-2") }}
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 xl:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
+                  </div>
+                </div>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "Odmítnutý předsedajícím")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
+              </div>
+              <div class="flex items-center space-x-4">
+                {{> molecules-thumbs }}
+                <div class="dropdown dropdown--right">
+                  <i class="ico--dots-three-vertical cursor-pointer"></i>
+                  <ul class="dropdown__content text-xs whitespace-no-wrap">
+                    <li class="dropdown__content-item bg-white hover:bg-grey-125">
+                      <a class="block px-2 py-3" href="#"><i class="ico--lock text-2xs mr-1"></i> Zablokovat uĹľivatele</a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+            </div>
           </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
         </div>
       </div>
     </div>
 
-  </article>
-</div>
+    <div class="my-8 space-y-4">
+      {{> molecules-textarea-field(nolabel: true, placeholder: "Vyplňte text vašeho příspěvku", rows: 5) }}
+      <div class="space-x-4">
+        {{> molecules-dropdown-button(cta: "Přidat příspěvek") }}
+        <span class="text-sm text-grey-200 hidden lg:inline">Pro pokročilejší formátování můžete používat <a href="#" class="underline">Markdown</a>.</span>
+      </div>
+    </div>
+  </section>
+</article>
 
 <div class="modal__overlay hidden" id="js-announce-proposal-modal">
   <div class="modal__content" role="dialog">
diff --git a/source/_patterns/03-templates/cf2021/user.mustache b/source/_patterns/03-templates/cf2021/user.mustache
index 517ac7c10d279d0bd2fd64780f7b50df5bc6e2ce..aa7ac0bc4fa3c9abe65d09fc4665fed1697a51f0 100644
--- a/source/_patterns/03-templates/cf2021/user.mustache
+++ b/source/_patterns/03-templates/cf2021/user.mustache
@@ -1,196 +1,241 @@
 {{> organisms-simplified-navbar-with-avatar }}
 
-<div class="container container--wide pt-8 lg:py-24">
-  <article>
-    <div class="grid grid-cols-3 gap-8">
-      <div class="col-span-2 space-y-8">
-        <div class="flex items-center justify-between mb-8">
-          <h1 class="head-alt-lg mb-0 pt-1 pr-8">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
-        </div>
+<article class="container container--wide pt-8 lg:py-24 cf2021">
+  <section class="cf2021__video space-y-8">
+    <div class="flex items-center justify-between mb-4 lg:mb-8">
+      <h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
+    </div>
 
-        <iframe width="100%" height="610" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+    <iframe width="100%" height="500" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+  </section>
 
-        <section>
-          <div class="flex justify-between items-center mb-4">
-            <h2 class="head-heavy-sm whitespace-no-wrap">Příspěvky v rozpravě</h2>
-            <div class="flex items-center">
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs">
-                <select>
-                  <option value="">Vše</option>
-                  <option value="">Jen aktivnĂ­</option>
-                  <option value="">Jen archivované</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1">
-                <select>
-                  <option value="">Podle ÄŤasu</option>
-                  <option value="">Podle podpory</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
-              <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs mr-4 ml-1">
-                <select>
-                  <option value="">Návrhy i příspěvky</option>
-                  <option value="">Jen návrhy</option>
-                  <option value="">Jen příspěvky</option>
-                </select>
-                <span class="chip__icon ico--chevron-down"></span>
-              </span>
+  <section class="cf2021__notifications">
+    <div class="lg:card lg:elevation-10">
+      <div class="lg:card__body pb-2 lg:py-6">
+        <h2 class="head-heavy-sm">Oznámení</h2>
+      </div>
 
-              {{> molecules-chip-pagination }}
-            </div>
-          </div>
+      <div class="container-padding--zero lg:container-padding--auto">
+        {{> organisms-event-feed(itemPadding: "px-4 py-2 lg:px-8 lg:py-3") }}
+      </div>
+    </div>
+  </section>
+
+  <section class="cf2021__posts">
+    <div class="flex flex-col xl:flex-row xl:justify-between xl:items-center mb-4">
+      <h2 class="head-heavy-sm whitespace-no-wrap">Příspěvky v rozpravě</h2>
+      <div class="flex flex-col space-y-2 xl:space-y-0 xl:space-x-8 xl:flex-row xl:items-center">
+        <div class="-mx-1">
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Vše</option>
+              <option value="">Jen aktivnĂ­</option>
+              <option value="">Jen archivované</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Podle ÄŤasu</option>
+              <option value="">Podle podpory</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+          <span class="chip chip--grey-125 chip--select chip--hoveractive text-xs ml-1 mt-2 xl:mt-0">
+            <select>
+              <option value="">Návrhy i příspěvky</option>
+              <option value="">Jen návrhy</option>
+              <option value="">Jen příspěvky</option>
+            </select>
+            <span class="chip__icon ico--chevron-down"></span>
+          </span>
+        </div>
 
-          <div class="space-y-6">
-            <div class="flex items-start bg-yellow-100 bg-opacity-50 p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:46</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                    </div>
-                    {{> molecules-thumbs }}
+        <div>
+          {{> molecules-chip-pagination }}
+        </div>
+      </div>
+    </div>
+
+    <div class="space-y-6 container-padding--zero lg:container-padding--auto">
+      <div class="flex items-start bg-yellow-100 bg-opacity-50 p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:46</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
-                      <a href="#" class="text-grey-200 text-xs ml-2 underline">(Upraveno přesdedajícím)</a>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
+                    <a href="#" class="text-grey-200 text-xs ml-2 underline">(Upraveno přesdedajícím)</a>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:38</span>
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:38</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300", cta: "Příspěvek")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--green-400 chip--condensed ml-2", cta: "Schválený")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:40</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--green-400 chip--condensed ml-2", cta: "Schválený")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "ZamĂ­tnutĂ˝")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 lg:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "ZamĂ­tnutĂ˝")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
-            <div class="flex items-start p-2 -ml-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
-              <img src="{{ img.avatar.src }}" class="w-14 h-14 rounded mr-3">
-              <div class="flex-1 overflow-hidden">
-                <div class="mb-1">
-                  <div class="flex justify-between">
-                    <div class="flex items-center">
-                      <span class="font-bold">{{ person.first }} {{ person.last }}</span>
-                      <span class="text-grey-200 text-sm ml-2">KS PardubickĂ˝ kraj</span>
-                      <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
-                      {{> molecules-chip(classes: "chip--cyan-200 chip--condensed ml-2", cta: "Návrh postupu")}}
-                      {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "Odmítnutý předsedajícím")}}
-                      {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
-                    </div>
-                    {{> molecules-thumbs }}
+          </div>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
+      </div>
+      <div class="flex items-start p-4 lg:p-2 lg:-m-2 opacity-25 hover:opacity-100 transition-opacity duration-200">
+        <img src="{{ img.avatar.src }}" class="w-8 h-8 lg:w-14 lg:h-14 rounded mr-3">
+        <div class="flex-1">
+          <div class="mb-1">
+            <div class="flex justify-between items-start xl:items-center">
+              <div class="flex flex-col xl:flex-row xl:items-center">
+                <div class="flex flex-col xl:flex-row xl:items-center">
+                  <span class="font-bold">{{ person.first }} {{ person.last }}</span>
+                  <div class="mt-1 xl:mt-0">
+                    <span class="text-grey-200 text-sm">KS PardubickĂ˝ kraj</span>
+                    <span class="text-grey-200 ml-1 text-sm">@ 11:30</span>
                   </div>
                 </div>
-                <p class="text-black leading-normal">{{ excerpt.medium }}</p>
+                <div class="flex flex-row flex-wrap lg:flex-no-wrap lg:items-center mt-1 xl:mt-0 xl:ml-2">
+                  {{> molecules-chip(classes: "chip--cyan-200 chip--condensed", cta: "Návrh postupu")}}
+                  {{> molecules-chip(classes: "chip--red-600 chip--condensed ml-2", cta: "Odmítnutý předsedajícím")}}
+                  {{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "ArchivovanĂ˝")}}
+                </div>
               </div>
+              {{> molecules-thumbs }}
             </div>
           </div>
-
-          <div class="my-8 space-y-4">
-            {{> molecules-textarea-field(nolabel: true, placeholder: "Vyplňte text vašeho příspěvku", rows: 5) }}
-            <div class="space-x-4">
-              {{> molecules-dropdown-button(cta: "Přidat příspěvek") }}
-              <span class="text-sm text-grey-200">Pro pokročilejší formátování můžete používat <a href="#" class="underline">Markdown</a>.</span>
-            </div>
-          </div>
-        </section>
+          <p class="text-sm lg:text-base text-black leading-normal">{{ excerpt.medium }}</p>
+        </div>
       </div>
-      <div>
-        <div class="lg:card lg:elevation-10">
-          <div class="lg:card__body lg:py-6">
-            <h2 class="head-heavy-sm">Oznámení</h2>
-          </div>
+    </div>
 
-          {{> organisms-event-feed(itemPadding: "px-8 py-4") }}
-        </div>
+    <div class="my-8 space-y-4">
+      {{> molecules-textarea-field(nolabel: true, placeholder: "Vyplňte text vašeho příspěvku", rows: 5) }}
+      <div class="space-x-4">
+        {{> molecules-dropdown-button(cta: "Přidat příspěvek") }}
+        <span class="text-sm text-grey-200 hidden lg:inline">Pro pokročilejší formátování můžete používat <a href="#" class="underline">Markdown</a>.</span>
       </div>
     </div>
+  </section>
 
-  </article>
-</div>
+</article>
diff --git a/source/css/style.pcss b/source/css/style.pcss
index 1e31f33f069c93fb463d8d5e879eb23afc937431..d4d2c5b2beed3dfa0cb78523f7e26f7b0c626eed 100644
--- a/source/css/style.pcss
+++ b/source/css/style.pcss
@@ -62,6 +62,7 @@
 @import "./organisms/region-map.pcss";
 
 @import "./templates/candidate-detail.pcss";
+@import "./templates/cf2021.pcss";
 
 /**
 * This injects Tailwind's utility classes and any utility classes registered
diff --git a/source/css/templates/cf2021.pcss b/source/css/templates/cf2021.pcss
new file mode 100644
index 0000000000000000000000000000000000000000..2d4d64036e20b25a0d79994042e656662b784744
--- /dev/null
+++ b/source/css/templates/cf2021.pcss
@@ -0,0 +1,26 @@
+.cf2021 {
+  @apply grid gap-8;
+
+  grid-template-areas: "video"
+                       "notifications"
+                       "posts";
+
+  @screen lg {
+    grid-template-areas: "video notifications"
+                         "posts notifications";
+    /* Needs to match .candidate-card__avatar width */
+    grid-template-columns: theme("width.2/3") 1fr;
+  }
+}
+
+.cf2021__video {
+  grid-area: video;
+}
+
+.cf2021__notifications {
+  grid-area: notifications;
+}
+
+.cf2021__posts {
+  grid-area: posts;
+}