diff --git a/nuxt/app.vue b/nuxt/app.vue
index 245da50..30f4384 100644
--- a/nuxt/app.vue
+++ b/nuxt/app.vue
@@ -26,6 +26,10 @@
     background: var(--siva);
   }
 
+  a {
+    color: var(--crna);
+  }
+
   h1 {
     text-align: center;
     font-size: 5rem;
@@ -46,7 +50,6 @@
   a.gumb {
     text-decoration: underline;
     font-size: 3rem;
-    color: var(--crna);
     position: relative;
     display: flex;
     width: 100%;
@@ -85,6 +88,7 @@
   .navodila {
     padding-left: 2rem;
     padding-right: 2rem;
+    text-align: center;
   }
 
   footer {
@@ -93,7 +97,7 @@
 }
 
 
-  @media screen and (max-width: 325px) {
+  @media screen and (max-width: 420px) {
     .vsebina {
       padding-right: 0;
       padding-left: 0;
@@ -103,7 +107,7 @@
     }
   }
 
-  section.pojem {
+  .okvir {
     position: relative;
     background: var(--bela);
     margin: 2rem;
diff --git a/nuxt/components/Glava.vue b/nuxt/components/Glava.vue
index 3b5fa09..2192caf 100644
--- a/nuxt/components/Glava.vue
+++ b/nuxt/components/Glava.vue
@@ -2,21 +2,34 @@
 const route = useRoute()
 
 const pot = computed(() => route.path)
-const naManifestu = computed(() => route.path.indexOf('/pojmi') === 0)
+const naManifestu = computed(() => route.path.indexOf('/manifest') === 0)
 </script>
 
 <template>
-    <section class="glava" :class="{ manifest: naManifestu }">
-      <ul class="meni">
-          <li><NuxtLink to="/">Domov</NuxtLink></li>
-          <li><NuxtLink to="/pojmi">Manifest</NuxtLink></li>
-          <li><NuxtLink to="https://yugofuturism.kompot.si/user" target="_blank">admin</NuxtLink></li>
-      </ul>
-      <img src="/images/zvezda.png">
+  <section class="glava" :class="{ manifest: naManifestu }">
+    <ul class="meni">
+      <li>
+        <NuxtLink to="/">
+          Domov
+        </NuxtLink>
+      </li>
+      <li>
+        <NuxtLink to="/manifest">
+          Manifest
+        </NuxtLink>
+      </li>
+      <li>
+        <NuxtLink to="https://yugofuturism.kompot.si/user" target="_blank">
+          admin
+        </NuxtLink>
+      </li>
+    </ul>
 
-      <h1 v-if="naManifestu">MANIFEST</h1>
-      <h1 v-else>JUGOFUTURIZEM</h1>
-    </section>
+    <img src="/images/zvezda.png">
+
+    <h1 v-if="naManifestu">MANIFEST</h1>
+    <h1 v-else>JUGOFUTURIZEM</h1>
+  </section>
 </template>
 
 <style scoped>
@@ -103,4 +116,14 @@ ul {
   }
 }
 
+@media screen and (min-width: 768px) {
+  .glava img {
+    width: 768px;
+    height: auto;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+
 </style>
diff --git a/nuxt/components/Noga.vue b/nuxt/components/Noga.vue
index 6947c6b..562d48d 100644
--- a/nuxt/components/Noga.vue
+++ b/nuxt/components/Noga.vue
@@ -8,37 +8,40 @@ const naManifestu = computed(() => route.path.indexOf('/pojmi') === 0)
 <template>
 <section class="noga">
     <div class="maska">
-        <a href="maska.si">
+        <a href="https://maska.si" target="_blank">
             <img src="/images/maska-logo.svg" />
         </a>
     </div>
     <div class="kompot">
         <p>
-            2024 <a href="kompot.si">Kompot</a>
+          <a href="https://kompot.si" target="_blank">
+            <img src="/images/kompot_sm.png">
+            2024
+            Kompot
+          </a>
         </p>
-            
     </div>
     <div class="eu-projekti">
-    <div class="eu-projekti-logos">
-        <img src="/images/peripheralvisions.svg" />
+      <div class="eu-projekti-logos">
+        <img src="/images/peripheralvisions.png" />
         <img src="/images/eu-logo.svg" />
-    </div>
-    <p>Funded by the European Union. Views and opinions expressed are however those of the author(s) only and do not necessarily reflect those of the European Union or European Education and Culture Executive Agency (EACEA). Neither the European Union nor the granting authority can be held responsible for them.</p>
+      </div>
+      <p>Funded by the European Union. Views and opinions expressed are however those of the author(s) only and do not necessarily reflect those of the European Union or European Education and Culture Executive Agency (EACEA). Neither the European Union nor the granting authority can be held responsible for them.</p>
     </div>
 </section>
 </template>
 
 <style scoped>
 .noga {
-    height: fit-content;
-    background-color: black;
-    z-index: 100;
-    display: flex;
-    flex-direction: row;
-    justify-content: space-around;
-    align-content: center;
-    flex-wrap: wrap;
-    padding: 2rem;
+  background-color: black;
+  z-index: 100;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  align-content: center;
+  flex-wrap: wrap;
+  padding: 2rem;
+  align-content: center;
 }
 
 p, a {
@@ -46,6 +49,11 @@ p, a {
     text-decoration: none;
 }
 
+a {
+  margin-left: auto;
+  margin-right: auto;
+}
+
 .noga > div {
     position: relative;
     display: block;
@@ -59,6 +67,7 @@ p, a {
 img {
     width: 100%;
     height: auto;
+    max-width: 300px;
 }
 
 .eu-projekti {
@@ -71,6 +80,12 @@ img {
 
 }
 
+a {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
 .eu-projekti-logos {
     position: relative;
     width: 100%;
diff --git a/nuxt/components/Pojem.vue b/nuxt/components/Pojem.vue
index 507ca26..b469069 100644
--- a/nuxt/components/Pojem.vue
+++ b/nuxt/components/Pojem.vue
@@ -10,11 +10,13 @@ const props = defineProps({
   naslov: String
 })
 
+if (props.naslov && !(props.naslov in store.pojmi)) {
+  await store.naloziPojme()
+}
+
 const pojem = computed(() => store.pojmi[props.naslov])
 const revisionId = computed(() => pojem.value.id)
 
-await store.naloziPojme()
-
 const urejanje = ref(false)
 const container = ref(null)
 
@@ -29,88 +31,71 @@ const urediPojem = async () => {
 }
 
 onMounted(() => {
-  // Link na pojem direktno? Poskrolaj nanj + odpri editiranje
+  // Link na editiranje pojma? Poskrolaj nanj + odpri editiranje
   if (route.params.guid === revisionId.value) {
     urejanje.value = true
-    window.container = container
-    setTimeout(() => window.container.value.scrollIntoView(), 50)
+    setTimeout(() => obrazec.value.scrollIntoView({ behavior: 'smooth' }), 50)
+  } else {
+    // Sicer samo poskrolaj na pojem
+    setTimeout(() => container.value.scrollIntoView({ behavior: 'smooth' }), 50)
   }
 })
 
 </script>
 
 <template>
-  <section class="pojem" ref="container">
-    <div>
-      <h2>{{ pojem.naslov }}</h2>
+  <section ref="container">
+    <div v-if="!urejanje" class="gumb" @click="urediPojem">Uredi</div>
+    <div v-if="pojem" class="pojem">
+      <h2>{{ pojem }}</h2>
       <div class="tekst" v-html="pojem.tekst" />
     </div>
     <PojemForm v-if="urejanje"
+     ref="obrazec"
      :revisionId="revisionId"
      :pojem="pojem"
      :urejanje="urejanje"
      :onZapri="() => { urejanje = false; store.naloziPojme()}"
      />
-    <div>
-      <div v-if="!urejanje" class="gumb" @click="urediPojem">Uredi</div>
-    </div>
   </section>
 </template>
 
 <style scoped>
-  section.pojem {
-    position: relative;
-    background: var(--bela);
-    margin: 2rem;
-    border-radius: 24px;
-    padding: 2rem;
-    display: flex;
-    flex-wrap: wrap;
-    box-sizing: border-box;
-    max-width: 1216px;
-    margin-left: auto;
-    margin-right: auto;
-  }
 
-  form.pojem {
-    width: calc(50% - 32px);
-    margin-left: 32px;
-    gap: 1rem;
-  }
-
-  .pojem > div {
+  .pojem {
     position: relative;
     width: 50%;
+    float: left;
   }
 
   h2 {
     text-transform: uppercase;
     margin-top: 0;
   }
+
+  form.pojem {
+    width: calc(50% - 32px);
+    margin-left: 32px;
+    gap: 1rem;
+    float: right;
+  }
+
   .gumb {
-    position: absolute;
-    bottom: 0;
+    position: sticky;
+    top: 0;
     right: 0;
-    text-decoration: underline;
-    font-size: 3rem;
+    float: right;
   }
 
   @media screen and (max-width: 768px) {
-    PojemForm {
-      width: 50%;
-      float: right;
-    }
-    .pojem > div {
+    .pojem {
       min-height: 4rem;
       width: 100%;
     }
-  }
 
-    @media screen and (max-width: 768px) {
-      form.pojem {
-        width: 100%;
-        margin-left: 0;
-        min-height: 70vh;
+    form.pojem {
+      margin-left: 0;
+      min-height: 70vh;
     }
   }
 </style>
diff --git a/nuxt/components/PojemForm.vue b/nuxt/components/PojemForm.vue
index 551ffee..3470cd5 100644
--- a/nuxt/components/PojemForm.vue
+++ b/nuxt/components/PojemForm.vue
@@ -30,9 +30,9 @@ const oddajPredlog = async data => {
 // @TODO tole raje v pojmi.vue oz nov_pojem.vue - page!
 const etherNalozen = ev => {
   if (props.pojem.nov) {
-    navigateTo('/nov_pojem/' + props.revisionId)
+    navigateTo('/manifest/dodaj/' + props.revisionId)
   } else {
-    navigateTo('/pojmi/' + props.revisionId)
+    navigateTo('/manifest/' + props.revisionId)
   }
   //window.location.hash = props.revisionId
 }
diff --git a/nuxt/composables/crypto.js b/nuxt/composables/crypto.js
new file mode 100644
index 0000000..f164870
--- /dev/null
+++ b/nuxt/composables/crypto.js
@@ -0,0 +1,10 @@
+import * as cryptoServer from 'crypto'
+
+export const useCrypto = () => {
+
+  return {
+    getRandomUUID: () => (typeof window === 'undefined')
+      ? cryptoServer.randomBytes(16).toString('hex') // Server code
+      : crypto.randomUUID()                          // Browser code
+  }
+}
diff --git a/nuxt/nuxt.config.js b/nuxt/nuxt.config.js
index 38ef142..858152b 100644
--- a/nuxt/nuxt.config.js
+++ b/nuxt/nuxt.config.js
@@ -41,13 +41,17 @@ export default defineNuxtConfig({
   hooks: {
     'pages:extend' (pages) {
       pages.push({
-        name: 'pojem',
-        path: '/pojmi/:guid',
-        file: '~/pages/pojmi.vue'
+        name: 'poglej_pojem',
+        path: '/manifest/:naslov',
+        file: '~/pages/manifest/pojem.vue'
+      }, {
+        name: 'uredi_pojem',
+        path: '/manifest/:naslov/uredi/:guid',
+        file: '~/pages/manifest/pojem.vue'
       }, {
         name: 'nov_pojem_guid',
-        path: '/nov_pojem/:guid',
-        file: '~/pages/nov_pojem.vue'
+        path: '/manifest/dodaj/:guid',
+        file: '~/pages/manifest/dodaj.vue'
       })
     }
   }
diff --git a/nuxt/pages/nov_pojem.vue b/nuxt/pages/manifest/dodaj.vue
similarity index 76%
rename from nuxt/pages/nov_pojem.vue
rename to nuxt/pages/manifest/dodaj.vue
index dd72843..0247e39 100644
--- a/nuxt/pages/nov_pojem.vue
+++ b/nuxt/pages/manifest/dodaj.vue
@@ -1,9 +1,6 @@
 <script setup="setup">
 
-import * as cryptoServer from 'crypto'
-const getRandomUUID = () => (typeof window === 'undefined')
-      ? cryptoServer.randomBytes(16).toString('hex')
-      : crypto.randomUUID()
+const { getRandomUUID } = useCrypto()
 
 const { etherpadApiUrl } = useEtherpadApi()
 const route = useRoute()
diff --git a/nuxt/pages/pojmi.vue b/nuxt/pages/manifest/index.vue
similarity index 72%
rename from nuxt/pages/pojmi.vue
rename to nuxt/pages/manifest/index.vue
index 0b4a0a6..04d3598 100644
--- a/nuxt/pages/pojmi.vue
+++ b/nuxt/pages/manifest/index.vue
@@ -10,15 +10,20 @@ await store.naloziPojme()
   <NuxtLink class="gumb" to="/nov_pojem">
     Dodaj Nov Pojem
   </NuxtLink>
-  <Pojem
+  <NuxtLink
     v-for="pojem in Object.keys(store.pojmi)"
     :naslov="pojem"
-    :key="store.pojmi[pojem].id" />
-
+    :to="`/manifest/${pojem}`"
+    class="okvir">
+    <h2>{{ pojem }}</h2>
+  </NuxtLink>
 </template>
 
 <style scoped>
-  DodajPojem {
-    float: right
+  a {
+    clear: both;
+  }
+  h2 {
+    margin-bottom: 0;
   }
 </style>
diff --git a/nuxt/pages/manifest/pojem.vue b/nuxt/pages/manifest/pojem.vue
new file mode 100644
index 0000000..5c4ce82
--- /dev/null
+++ b/nuxt/pages/manifest/pojem.vue
@@ -0,0 +1,22 @@
+<script setup="setup">
+
+const { etherpadApiUrl } = useEtherpadApi()
+const { naslov, guid } = useRoute().params
+const { getRandomUUID } = useCrypto()
+
+const revisionId = ref(null)
+
+revisionId.value = guid ?? getRandomUUID()
+
+// Ustvari nov, prazen pad
+// @TODO parameter za seranje linka?
+const padId = revisionId.value
+const resp = await $fetch(`${etherpadApiUrl}/createPad?padID=${padId}`)
+
+</script>
+
+<template>
+  <div class="okvir">
+    <Pojem :naslov="naslov" />
+  </div>
+</template>
diff --git a/nuxt/public/images/kompot_sm.png b/nuxt/public/images/kompot_sm.png
new file mode 100644
index 0000000..441c96e
Binary files /dev/null and b/nuxt/public/images/kompot_sm.png differ
diff --git a/nuxt/public/images/peripheralvisions.png b/nuxt/public/images/peripheralvisions.png
new file mode 100644
index 0000000..51fa62a
Binary files /dev/null and b/nuxt/public/images/peripheralvisions.png differ
diff --git a/nuxt/stores/pojmi.js b/nuxt/stores/pojmi.js
index 74c7719..1b83922 100644
--- a/nuxt/stores/pojmi.js
+++ b/nuxt/stores/pojmi.js
@@ -6,7 +6,7 @@ export const usePojmiStore = defineStore('pojmi', {
     async naloziPojme() {
       const { jsonApiUrl, headers, deserialize } = useApi()
 
-      const data = await $fetch(`${jsonApiUrl}/node/concept?sort=created`, { headers })
+      const data = await $fetch(`${jsonApiUrl}/node/concept?sort=-changed`, { headers })
       this.pojmi = await deserialize(data, s => ({
         id: s.id,
         naslov: s.title,