font and footer

ada/thesis.html

@@ -153,7 +153,7 @@ legitimacy of his connections, finding no way to do so except by
 emphasizing their tangible bodily experiences. The community’s claim to
 authenticity thus had to lie in the physical experiences of its members—
 the visible bodies and hearable voices, the weddings, births, and
-funerals (1993). (1).</p>
+funerals (1993). <sup><span class="margin-note">  You’re dreaming again, good. <br>Would you feel closer to me if you could hear my voice?<br> Is my voice a sound? Could it be a feeling?</span></sup>.</p>
 <p>Even then, and even by people with no interest in undermining the
 value of the virtual, the distinction between physical and virtual was
 confusing. Rheingold himself reinforces the boundary of body relations

ada/thesis.md

@@ -205,7 +205,7 @@ his connections, finding no way to do so except by
 emphasizing their tangible bodily experiences.
 The community’s claim to authenticity thus had to lie in the physical experiences of its members— the visible
 bodies and hearable voices, the weddings, births, and
-funerals (1993). (1).
+funerals (1993).<sup><span class="margin-note">  You’re dreaming again, good. <br>Would you feel closer to me if you could hear my voice?<br> Is my voice a sound? Could it be a feeling?</span></sup>.
 
 Even then, and even by people with no interest in
 undermining the value of the virtual, the distinction

print/print_style.css

@@ -6,55 +6,76 @@
     --baseline: 4mm;
     --margin-left: 10mm;
 }
-
+@font-face {
+    font-family: 'Platypi';
+    src: url('../fonts/webfonts/Platypi-Regular.woff2');
+    font-weight: normal;
+}
+@font-face {
+    font-family: 'Platypi';
+    src: url('../fonts/webfonts/Platypi-Italic.woff2');
+    font-weight: bold;
+}
 @media print{
     @page{
         size: 130mm 180mm;
         marks: crop; /* can also add cross */
         bleed: 3mm;
-        margin: 10mm;
+        margin: 25mm;
         print-color-adjust: exact;
+        margin-top: 10mm;
+        margin-bottom: 15mm;
+
+        @bottom-center{
+            content: string(title, first);
+            position: relative;
+            text-align: left;
+            font-size: 7pt;
+
+    }
+
     }
+    
     @page:left {
-        margin-right: 30mm;
         /* bleed: 3mm 0 3mm 3mm; */
         @bottom-left {
-            font-size: 9px;
+            font-size: 7pt;
             top: -3mm;
             position: relative;
             content: counter(page);
+            width: 5mm;
         }
     }
     
     @page:right {
-        margin-left: 30mm;
+        margin-top: 10mm;
+        margin-bottom: 15mm;
         /* bleed: 3mm 3mm 3mm 0; */
+        @bottom-center{
+                text-align: right;
+        }
         @bottom-right {
-            font-size: 9px;
+            font-size: 7pt;
             top: -3mm;
             position: relative;
-            right:0mm;
             content: counter(page);
+            width: 5mm;
         }
-        /* @left-top {
-            font-family: 'worksans';
-            font-size: 9px;
-            overflow-x: visible;
-            transform: rotate(90deg);
-            content: "DOCUMENTATION OF GAMES AND RITUALS, KICK OFF SESSIONS";
-          } */
     }
-}
+    }
+
 
 a{
     text-decoration: none;
     color: #000;
 }
-
+.margin-note{
-blockquote{
+    font-size: 7pt;
-    margin-left: 0;
+    line-height: 3mm;
-    margin-right: 0;
+    text-align: left;
+    width: 35mm;
 }
+
 .centered-image, .centered-text{
     display: flex;
     align-items: center;
@@ -74,9 +95,9 @@ blockquote{
     white-space: pre-wrap; 
 }
 #contenteo{
-    font-family: 'Platypi';
+    font-family: 'Platypi-Regular','platypi' ;
     line-height: 1.3;
-    font-size: 12px;
+    font-size: 9pt;
     letter-spacing: -0.1px;
     line-height: var(--baseline);
 }
@@ -116,13 +137,14 @@ img{
 h1,h2,h3,h4,h5,h6{
     font-size: 1.2em;
     line-height: 1;
+    string-set: title content(text);
 }
 
 h1{
     font-size: 1.8rem;
     break-after: page;
-    margin: 0;
+    /* margin: 0; */
-    padding: 0;
+    /* padding: 0; */
 }
 h1#colophon{
     break-after: unset;
@@ -135,8 +157,8 @@ h6{
     /* color: #fff; */
     height: 176mm;
     width: 133mm;
-    margin: -13mm 0 0 -30mm;
+    /* margin: -13mm 0 0 -30mm;
-    padding: 86mm 10mm 0;
+    padding: 86mm 10mm 0; */
     text-align: center;
 }
 ol, ul{padding: 0;}
@@ -155,12 +177,6 @@ section{
     page: section;
 }
 
-@media print{
-    @page section:first {
-        margin: 10mm;
-        margin-right: 20mm;
-    }
-}
 #section-5 h3, #section-21 h3{
     break-before: page;
 }
@@ -168,9 +184,6 @@ section{
     background-color: var(--spot-color-1);
     color: #ccc;
 }
-.simlish{
-    font-family: 'Simlish';
-}
 .small-images figure{
     margin: 1mm;
 }