diff --git a/media/Vector.png b/media/Vector.png
new file mode 100644
index 0000000..a76d3a6
Binary files /dev/null and b/media/Vector.png differ
diff --git a/src/components/Issues.vue b/src/components/Issues.vue
index 6fa9312..2ba7bac 100644
--- a/src/components/Issues.vue
+++ b/src/components/Issues.vue
@@ -80,9 +80,12 @@ a {
     <b-row class="about-text">
         <b-col md="6">
           <p id="footer">
-            <a href="/firstissue">Issue #1: On eating in isolation</a>
+            <router-link to="/firstissue">Issue #1: On eating in isolation</router-link>
               <br>
-            <a href="/">Issue #2: On adapting</a></p>
+            <router-link to="/">Issue #2: On adapting</router-link>
+          <br>
+          <router-link to="/thirdedition">Issue #3: On Routine</router-link>
+        </p>
         </b-col>
       </b-row>
     </b-container>
diff --git a/src/components/ThirdEdition.vue b/src/components/ThirdEdition.vue
index 41cf51e..f07b1b0 100644
--- a/src/components/ThirdEdition.vue
+++ b/src/components/ThirdEdition.vue
@@ -1,20 +1,7 @@
 <style scoped>
 
-@import url('https://fonts.googleapis.com/css?family=Inconsolata&display=swap');
-@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Poppins&family=Raleway&family=Work+Sans:wght@900&display=swap');
-@font-face {
-  font-family: 'Happy Times';
-  src: url('../../fonts/happy-times-NG_regular_master.otf');
-}
-@font-face {
-  font-family: 'Semi Light Dots';
-  src: url('../../fonts/AC1-SemiLightDots.otf');
-}
-@font-face {
-  font-family: 'ED Regular';
-  src: url('../../fonts/ED-Regular.otf');
-}
+
 
 @font-face {
   font-family: 'AUTHENTICSans';
@@ -23,12 +10,10 @@
 }
 * {
     border: 0px black solid;
-    background-color: #E6F2FB;
 
 }
 
 body {
-  background-color: #E6F2FB;
   min-height: 100vh;
 }
 
@@ -58,12 +43,13 @@ body {
 
 
 #mag_subtitle {
-  font-size: 250%;
+  font-size: 170%;
   font-family: 'AUTHENTICSans';
   color: black;
   background-color: transparent;
   height: auto;
-  text-align: left;
+  text-align: center;
+  padding-top: 20px;
 }
 
 .summary {
@@ -87,16 +73,30 @@ body {
 }
 
 #toc {
+  background-color: transparent;
   color: #1B75BC;
   font-family: 'AUTHENTICSans';
-  font-size: 120%;
+  font-size: 90%;
   text-align: center;
-  padding: 24px;
-  max-width: 100%;
+  padding-top: 40px;
+  max-width: 90%;
   min-width: 70%;
   margin: 18px;
+
 }
 
+.item {
+  padding-top: 10px;
+}
+
+#route_image {
+  background-image:url("../../media/Vector.png");
+  background-size: cover;
+  background-repeat: no-repeat;
+  z-index: 100;
+}
+
+
 a {
   color: #1B75BC;
 }
@@ -153,11 +153,6 @@ a {
     padding-top: 10%;
   }
 
-  #magi {
-    width: 50%;
-    text-align: right;
-    margin-top: -24px;
-  }
 
   .col-md-2 {
   border: none;
@@ -197,52 +192,101 @@ a {
             <b-col md="6" offset-md="2">
               <router-link to="/about"><p id="mag_title">Magiun</p></router-link>
             </b-col>
-            <b-col id="edition">Winter 2021
+            <b-col md="4" id="edition">Winter 2021
             </b-col>
           </b-row>
 
+        </b-col>
+        <b-col md="6">
           <b-row>
-            <b-col md="6" offset-md="2">
-              <p id="mag_subtitle">#3 On Routine</p>
-            </b-col>
-          </b-row>
+            <b-col md="12">
+          <p id="mag_subtitle">#3 On Routine</p>
         </b-col>
-        <b-col md="4" offset-md="1">
+        </b-row>
           <b-row>
-            <b-col id="toc">
-              <p class="recipe_title">Contents</p>
+  <b-col md="12" id="toc">
+              <div id="route_image">
+              <b-row>
+                <b-col md="5">
+              <p class="item"><router-link to="/EditorNote3">Domestic Bliss</router-link><br>
+                <span class="author">Alice Strete</span>
+              </p>
+            </b-col>
+            </b-row>
+              <b-row>
+                <b-col md="5" offset-md="3">
               <p class="item"><router-link to="/twoberries">Floating on Habit</router-link><br>
                 <span class="author">Alina Turdean</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="4" offset-md="8">
               <p class="item"><router-link to="/workfromhome">Freestyle Platouaș</router-link><br>
                 <span class="author">Ileana Sebe</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="5" offset-md="4">
               <p class="item"><router-link to="/bananas">[each] Tuesday Afternoon</router-link><br>
                 <span class="author">Sylvie van Wijk</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="4">
               <p class="item"><router-link to="/popcorn">Yes, Chef</router-link><br>
                 <span class="author">Esmeralda Anstrauta</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="5" offset-md="3">
               <p class="item"><router-link to="/potato">One Way with Potatoes</router-link><br>
                 <span class="author">Honey Jones-Hughes</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="6" offset-md="6">
               <p class="item"><router-link to="/bowl">Cooking Apart Together</router-link><br>
                 <span class="author">Louisa Bufardeci and Inge Hoonte</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="6" offset-md="2">
               <p class="item"><router-link to="/threeeggs">Me, My Mom and those Three Eggs</router-link><br>
                 <span class="author">Patricia Cîrtog</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="4">
               <p class="item"><router-link to="/olives">A Jar of Green Olives</router-link><br>
                 <span class="author">Raluca Chereji</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="4" offset-md="5">
               <p class="item"><router-link to="/vodka">Spoiled</router-link><br>
                 <span class="author">Ana-Maria Gușu</span>
               </p>
+            </b-col>
+            </b-row>
+            <b-row>
+              <b-col md="5" offset-md="7">
               <p class="item"><router-link to="/mittens">How to Poach an Egg (Perfectly)</router-link><br>
                 <span class="author">Valentina Vella</span>
               </p>
             </b-col>
+            </b-row>
+            </div>
+            </b-col>
           </b-row>
+
         </b-col>
       </b-row>
       <b-row>
diff --git a/src/components/edition2/knife.vue b/src/components/edition2/knife.vue
index cb8225e..74e6a27 100644
--- a/src/components/edition2/knife.vue
+++ b/src/components/edition2/knife.vue
@@ -220,9 +220,9 @@ export default {
         return {
         }
     },
-//    components: {
-//        MenuBar
-//    },
+    components: {
+        MenuBar
+    }
 //    beforeRouteLeave(to, from, next) {
 //      let transitionName = to.meta.transitionName || from.meta.transitionName;
 
diff --git a/src/components/edition3/EditorNote3.vue b/src/components/edition3/EditorNote3.vue
index 4a73f01..12afae5 100644
--- a/src/components/edition3/EditorNote3.vue
+++ b/src/components/edition3/EditorNote3.vue
@@ -160,7 +160,7 @@ visibility: hidden;
       <b-col md="4" class="color_back">
         <b-row class="controls">
             <b-col md="12" class="arrows">
-              <a href="/" id="leftarrow"><b-img src="media/left-arrow.png"></b-img></a>
+              <router-link to="/" id="leftarrow"><b-img src="media/left-arrow.png"></b-img></router-link>
               <p id="onhover_left">Colophon</p>
             </b-col>
           </b-row>
@@ -205,7 +205,7 @@ For me, the way I move through the world matters. That includes the things I do
       <b-col md="4" class="color_next">
         <b-row class="controls">
             <b-col md="12" class="arrows">
-              <a href="/twoberries" id="rightarrow"><b-img src="media/right-arrow.png"></b-img></a>
+              <router-link to="/twoberries" id="rightarrow"><b-img src="media/right-arrow.png"></b-img></router-link>
               <p id="onhover_right">Floating on Habit</p>
             </b-col>
           </b-row>
diff --git a/src/components/edition3/colophon3.vue b/src/components/edition3/colophon3.vue
new file mode 100644
index 0000000..0f7174f
--- /dev/null
+++ b/src/components/edition3/colophon3.vue
@@ -0,0 +1,270 @@
+<style scoped>
+
+@font-face {
+  font-family: 'AUTHENTICSansLight';
+  src: url('../../../fonts/AUTHENTICSans-60.otf');
+  font-weight: lighter;
+}
+
+@font-face {
+  font-family: 'AUTHENTICSans';
+  src: url('../../../fonts/AUTHENTICSans-90.otf');
+  font-weight: 400;
+}
+
+
+
+* {
+    border: 0px black solid;
+    background-color: transparent;
+}
+
+.fadein {
+    opacity: 0;
+    -moz-transition: opacity 1.5s;
+    -webkit-transition: opacity 1.5s;
+    -o-transition: opacity 1.5s;
+    transition: opacity 1.5s;
+}
+
+body.loaded .fadein {
+    opacity: 1;
+}
+
+.container_width {
+  max-width: 100%;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 70px;
+}
+
+
+a:hover {
+  color: hotpink;
+  text-decoration: none;
+}
+
+a {
+  color: gray;
+}
+
+.content {
+  /*padding-right: 50px;*/
+  /*padding-left: 60px;*/
+  font-family: 'AUTHENTICSansLight';
+  font-weight: lighter;
+  font-size: 18px;
+  line-height: 24px;
+  padding-bottom: 40px;
+  color: black;
+  text-align: left;
+
+}
+
+.controls {
+  padding-top: 12px;
+  height: 120px;
+  z-index: 1;
+  position: relative;
+  }
+
+.title_story {
+  font-size: 48px;
+  font-family: 'AUTHENTICSans', sans-serif;
+  font-weight: 400;
+  padding-top: 70px;
+  color: black;
+  text-align: left;
+}
+
+
+.arrows {
+  font-size: 40px;
+  top: 30px;
+  color: black;
+  vertical-align: top;
+  overflow: hidden;
+  font-family: 'AUTHENTICSans';
+}
+
+.arrows p {
+visibility: hidden;
+}
+
+.arrows:hover p {
+  visibility: visible;
+
+}
+.arrows a {
+    display: block;
+}
+
+
+
+#leftarrow {
+  float: left;
+  color: black;
+}
+
+#rightarrow {
+  float: right;
+  color: black;
+}
+
+#onhover_right {
+  font-size: 15px;
+  margin-top: 60px;
+  text-align: right;
+}
+
+#onhover_left {
+  font-size: 15px;
+  margin-top: 60px;
+  text-align: left;
+}
+.image_container {
+  padding-top: 5px;
+}
+
+.photo {
+  max-height: 100%;
+  max-width: 100%;
+  padding: 12px;
+  margin-top: 40%;
+}
+
+
+.img-fluid {
+  filter: sepia(100%) saturate(300%) brightness(100%) hue-rotate(270deg);
+}
+
+
+
+.small_icon {
+  max-width: 60%;
+  padding-top: 100px;
+}
+
+.zoom {
+  max-width: 100%;
+}
+
+.color_back {
+  background-color: #5FC44F;
+}
+
+.color_next {
+  background-color: white;
+;
+}
+
+@media (max-width: 575px){
+     .small_icon {
+       display: none;
+
+     }
+     .title_story {
+       font-size: 48px;
+     }
+     .author {
+       font-size: 21px;
+     }
+
+     .content {
+       padding-bottom: 40px;
+     }
+
+     .photo {
+       padding-bottom: 40px;
+     }
+   }
+
+</style>
+
+<template>
+  <b-container fluid class="p-0">
+    <MenuBar/>
+
+
+    <b-row>
+        <b-col md="4" class="color_back">
+          <b-row class="controls">
+              <b-col md="12" class="arrows">
+                <router-link to="/mittens" id="leftarrow"><b-img src="media/left-arrow.png"></b-img></router-link>
+                <p id="onhover_left">How to Poach an Egg (perfectly)</p>
+              </b-col>
+            </b-row>
+
+        </b-col>
+
+        <b-col md="4" class="color_back">
+          <b-row>
+            <b-col md="12">
+            <p class="title_story">Colophon</p>
+          </b-col>
+          </b-row>
+
+<div class='content'>
+<p>Magiun Magazine,
+Issue 3, Winter 2021</p>
+<p>
+Magiun publishes thoughts
+on everyday food.</p>
+<p>
+This publication has been put together by Alice Strete, with Simon Browne</p>
+<p>
+------------------------------------------
+</p>
+<p>
+Contributions by:<br>
+Alina, Ileana, Sylvie, Esmeralda, Honey, Louise, Inge, Patricia,<br>
+Raluca, Ana-Maria, Valentina </p>
+
+<p>
+Typeface:
+Authentic Sans, designed by
+Christina Janus and Desmond Wong
+</p>
+<p>
+Graphic design:
+Simon Browne
+</p>
+<p>
+Illustration:
+Alice Strete
+</p>
+
+<p>
+Magiun Magazine, 2021<br>
+Copyleft: This is a free work, you can copy, distribute, and modify it under the terms of the Free Art License http://artlibre.org/licence/lal/en/
+</p>
+</div>
+
+      </b-col>
+      <b-col md="4" class="color_next">
+        <b-row class="controls">
+            <b-col md="12" class="arrows">
+              <router-link to="/EditorNote3" id="rightarrow"><b-img src="media/right-arrow.png"></b-img></router-link>
+              <p id="onhover_right">Domestic Bliss</p>
+            </b-col>
+          </b-row>
+      </b-col>
+        </b-row>
+
+      </b-container>
+</template>
+
+<script>
+import MenuBar from '../MenuBar'
+export default {
+    name: 'colophon3',
+    data: function() {
+        return {
+        }
+    },
+    components: {
+        MenuBar
+    }
+}
+
+</script>
diff --git a/src/components/edition3/mittens.vue b/src/components/edition3/mittens.vue
index dde16cc..9c0db72 100644
--- a/src/components/edition3/mittens.vue
+++ b/src/components/edition3/mittens.vue
@@ -277,7 +277,7 @@ And buying up our housing stock).<br>
 <b-col md="4" class="color_next">
   <b-row class="controls">
       <b-col md="12" class="arrows">
-        <router-link to="/vodka" id="rightarrow"><b-img src="media/right-arrow.png"></b-img></router-link>
+        <router-link to="/" id="rightarrow"><b-img src="media/right-arrow.png"></b-img></router-link>
         <p id="onhover_right">Colophon</p>
       </b-col>
     </b-row>
diff --git a/src/components/edition3/vodka.vue b/src/components/edition3/vodka.vue
index d10bc64..830ba01 100644
--- a/src/components/edition3/vodka.vue
+++ b/src/components/edition3/vodka.vue
@@ -1,18 +1,5 @@
 <style scoped>
-@import url('https://fonts.googleapis.com/css2?family=Viga&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap');
-@font-face {
-  font-family: 'Happy Times';
-  src: url('../../../fonts/happy-times-NG_regular_master.otf');
-}
-@font-face {
-  font-family: 'Semi Light Dots';
-  src: url('../../../fonts/AC1-SemiLightDots.otf');
-}
-@font-face {
-  font-family: 'ED Regular';
-  src: url('../../../fonts/ED-Regular.otf');
-}
+
 @font-face {
   font-family: 'AUTHENTICSansLight';
   src: url('../../../fonts/AUTHENTICSans-60.otf');
@@ -25,14 +12,7 @@
   font-weight: 400;
 }
 
-@keyframes slideInFromLeft {
-  0% {
-    transform: translateX(-100%);
-  }
-  100% {
-    transform: translateX(0);
-  }
-}
+
 
 * {
     border: 0px black solid;
diff --git a/src/main.js b/src/main.js
index 1edd54b..e6542b4 100644
--- a/src/main.js
+++ b/src/main.js
@@ -54,6 +54,8 @@ import workfromhome from './components/edition3/workfromhome'
 import bowl from './components/edition3/bowl'
 import EditorNote3 from './components/edition3/EditorNote3'
 import ThirdEdition from './components/ThirdEdition'
+import colophon3 from './components/edition3/colophon3'
+
 
 
 
@@ -106,8 +108,8 @@ const router = new VueRouter({
     { path: '/workfromhome', component: workfromhome },
     { path: '/bowl', component: bowl },
     { path: '/EditorNote3', component: EditorNote3 },
-    { path: '/thirdedition', component: ThirdEdition }
-
+    { path: '/thirdedition', component: ThirdEdition },
+    { path: '/colophon3', component: colophon3 }
 
   ]