diff --git a/open/index.html b/open/index.html
index 9ac255e..e512844 100644
--- a/open/index.html
+++ b/open/index.html
@@ -44,14 +44,34 @@
         
         </div>
 
-        <div id="bar">
+        <footer id="bar">
             <button onclick="drop()" class="bottoneCose">XPUB</button>
-        </div>
+        </footer>
 
         <div id="colophon">
             <h1>windows.open(Welcome)</h1>
-                <p>Architecture: Tancredi and Poni</p>
-                <p>Urbanistic: Clara, Louisa, Simon</p>
+            <p><b>Web Architects:</b><br class="onlyMobile">Tancre and Poni</p>
+            <p><b>Urban Planners:</b><br class="onlyMobile">Clara, Louisa, Simon</p>
+
+            <p><b>Contributions:</b></p>
+            <div class="colophonWrapper">
+                <p><i>HAM DISTRO</i> ⟶ XPUB3</p>
+                <p><i>OUIJA SEANCE</i> ⟶ Simon Brown</p>
+                <p><i>Blank Page Syndrome</i> ⟶ Clara Noseda</p>
+                <p><i>Lingo Bingo</i> ⟶ XPUB1</p>
+                <p><i>Civil Entertainment Sirens®</i> ⟶ Martin Foucaut</p>
+                <p><i>Oh, look at the wifi: words fly around</i> ⟶ Federico Poni</p>
+                <p><i>Ilinx</i> ⟶ Tancredi Di Giovanni</p>
+            </div>
+
+            <p><b>Bookshop:</b></p>
+            <div id="lastColophonWrapper" class="colophonWrapper" >
+                <p><i>Wor(l)ds for the Future</i> // published and distributed by XPUB1 </p>
+                <p><i>iper- ozio % versi</i> // Federico Poni, Enrico Taro'</p>
+                <p><i>Low-Tech Chronicles #1</i> // Mark van den Heuvel</p>
+                <p><i>Writing Cure</i> // Avital Barkai, Camilo Garcia A.</p>
+            </div>
+            <br class="onlyMobile"><br class="onlyMobile">
         </div>
 
         <script src="./scripts/App.js"></script>
diff --git a/open/scripts/Windows.js b/open/scripts/Windows.js
index f95c8f9..d375cb4 100644
--- a/open/scripts/Windows.js
+++ b/open/scripts/Windows.js
@@ -1,22 +1,22 @@
 const corpi = {
     0: { 
+        id:'greetings',
+        glyph: '📌',
+        title: 'let Greetings',
+        content: 'We are pleased to invite you to <b>window.open()</b>, a day-long festival, held by students and alumni of the Master of <b>Experimental Publishing</b> (<b>XPUB</b>) at <b>Page Not Found</b>.'
+    },
+    1: { 
         id:'xpub',
         glyph: '🖨️',
-        title: 'var xpub',
-        content: 'window.open() at PNF will be an interface for our XPUB program to speak/communicate to/with the public inside and outside of the physical space. We adjust, using windows in the street and in the browser in order to be able to communicate. This frames it as a "discursive/dialogical interface" through which attitudes, perspectives, backgrounds and situations are explored together in a program consisting of: presentations, workshops, publication launches, conversations and performances; both online and offline.'
+        title: 'var Xpub',
+        content: '<b>window.open()</b> at PNF will be an interface for our XPUB program to speak/communicate to/with the public inside and outside of the physical space. We adjust, using windows in the street and in the browser in order to be able to communicate. This frames it as a "discursive/dialogical interface" through which attitudes, perspectives, backgrounds and situations are explored together in a program consisting of: presentations, workshops, publication launches, conversations and performances; both online and offline.'
     },
-    1: { 
+    2: { 
         id:'interface',
         glyph: '📀',
-        title: 'const interface',
+        title: 'const Interface',
         content: 'A window is a framing device, an interface through which we can look inside, to spaces where small groups meet, and outside to the world beyond. Screens and windows delineate boundaries between public and private. Working with(in) a limitation, a frame(work), a situation, a context means adjusting our work to the state of affairs; it changes our way of thinking/framing it. We adjust, in order to be able to communicate within a temporary window of time, reframing our intentions and seeking opportunities to share some real-time realness.'
     },
-    2: { 
-        id:'greetings',
-        glyph: '📌',
-        title: 'let greetings',
-        content: 'We are pleased to invite you to window.open(), a day-long festival, held by students and alumni of the Master of Experimental Publishing (XPUB) at Page Not Found.'
-    },
     3: {
         id: 'collectiveioning',
         glyph: '👾',
diff --git a/open/styles/style.css b/open/styles/style.css
index 9b5d75b..f884c26 100644
--- a/open/styles/style.css
+++ b/open/styles/style.css
@@ -7,7 +7,7 @@ body {
   max-width: 100vw;
   background-color: blue;
   color: white;
-  font-family: Arial, Helvetica, sans-serif;
+  font-family: "Courier New", Courier, monospace;
   padding: 0;
   margin: 0;
 }
@@ -26,7 +26,6 @@ h1 {
 .draggable {
   display: none;
   position: absolute;
-  border: 2px white solid;
   background: black;
   -webkit-box-shadow: 0px 10px 13px -7px #000000,
     5px 5px 15px 5px rgba(0, 0, 0, 0.49);
@@ -60,21 +59,17 @@ h1 {
 
 .closable {
   position: absolute;
-  top: 0;
-  right: 0;
+  top: 6px;
+  right: -2px;
   cursor: pointer;
   width: 38px;
+  color: yellow;
+  border: none;
+  font-size: 18px;
 }
 
-/* 
-.closable button {
-  width: 35px;
-  height: 30px;
-} */
-
 .hover {
   font-weight: bolder;
-  color: white !important;
 }
 
 .icon:hover {
@@ -101,7 +96,6 @@ h1 {
   color: black;
   border: solid 2px blue;
   display: none;
-  padding: 1% 5%;
 }
 
 #colophon h1 {
@@ -129,6 +123,8 @@ h1 {
 .corpi {
   padding: 15px;
   min-width: 200px;
+  border-radius: 6px;
+  border: 2px yellow solid;
 }
 
 #program {
@@ -155,6 +151,18 @@ h1 {
   background-color: rgba(0, 0, 0, 0.1);
 }
 
+.iconContainer a {
+  color: blanchedalmond;
+}
+
+.iconContainer a:hover {
+  color: blanchedalmond;
+}
+
+.iconContainer a:visited {
+  color: blanchedalmond;
+}
+
 .iconContainer a p {
   margin: 0;
   padding: 0;
@@ -183,9 +191,10 @@ button {
 
 .textIcon {
   margin-top: -20px;
+  font-weight: medium;
 }
 
-/* FOOTER */
+/* FOOTER & COLOPHON*/
 .bottoneCose {
   user-select: none;
   display: inline-block;
@@ -197,12 +206,33 @@ button {
   background-color: rgba(0, 0, 0, 0);
 }
 
+.colophonWrapper {
+  margin-left: 20px;
+}
+
+#colophon {
+  padding: 40px;
+}
+
+#lastColophonWrapper {
+  margin-bottom: 0px;
+}
+
+/* GENERAL MODIFIERS */
+
+.onlyMobile {
+  display: none;
+}
+
 /* MEDIA QUERIES */
 
 /* On screens that are 992px or less, set the background color to blue */
 @media screen and (max-width: 700px) {
+  .onlyMobile {
+    display: inline;
+  }
+
   body {
-    background-color: red;
     font-size: 16px;
   }
 
@@ -223,10 +253,11 @@ button {
     right: unset !important;
     left: unset !important;
     border: unset !important;
-    display: block !important;
+    display: inline-block !important;
     position: unset !important;
     margin-bottom: 40px;
     cursor: unset !important;
+    border-radius: unset !important;
   }
 
   .closable {
@@ -257,4 +288,28 @@ button {
   .bottoneCose {
     width: unset;
   }
+
+  #colophon {
+    display: inline-block;
+    background-color: white;
+    width: -moz-available;
+    position: fixed;
+    top: 0;
+    text-align: center;
+    height: 100vh;
+    overflow-y: auto;
+    padding: 10px;
+  }
+
+  #colophon h1 {
+    font-size: 28px;
+  }
+
+  .colophonWrapper {
+    margin-left: 0px;
+  }
+
+  #lastColophonWrapper {
+    margin-bottom: 100px;
+  }
 }