updated CV and created interim print version from it

css/styles.css

@@ -1,12 +1,14 @@
 @import url("https://fontlibrary.org/face/tex-gyre-adventor");
 @import url("https://fontlibrary.org/face/thsarabun-new");
-body {
+
+@media only screen {
+  body {
     font: 1.6em "THSarabunNewRegular", Helvetica, sans-serif;
     color: #333;
     line-height: 0.8em;
-}
+  }
 
-a {
+  a {
     color: #FF3300;
     text-decoration: none;
     width: 100%;
@@ -14,75 +16,92 @@ a {
     -o-transition: color 0.3s ease;
     -webkit-transition: color 0.3s ease;
     transition: color 0.3s ease;
-}
+  }
 
-a:hover {
+  a:hover {
     color: #99FFFF;
     -moz-transition: color 1s ease;
     -o-transition: color 1s ease;
     -webkit-transition: color 1s ease;
     transition: color 1s ease;
-}
+  }
 
-h1, h2, h3, h4, h5 {
+  h1, h2, h3, h4, h5 {
     font-family: "TeXGyreAdventorRegular", sans-serif;
-}
+  }
 
-footer {
+  footer {
     grid-row: 9 / span 1;
     grid-column: 1 / 6;
-  margin: 40px 0px 10px; }
+    margin: 40px 0px 10px; 
+  }
+
   footer p {
     text-align: center;
     font-size: 0.5em;
-    color: #CECECE; }
+    color: #CECECE; 
+  }
 
-iframe {
+  iframe {
     max-width: 100%;
     max-height: auto;
     border: thin #99FFFF dashed;
-}
+  }
 
-nav {
+  nav {
     width: 100%;
     margin: 20px 0;
     text-align: center;
-}
+  }
+
   nav ul {
     list-style: none;
   }
+
   nav ul li {
     display: inline-block;
     padding: 0 15px;
   }
 
-#wrapper {
+  #wrapper {
     max-width: 900px;
     margin: 0 auto;
     display: grid;
     grid-gap: 10px;
     grid-template-columns: repeat(6) 10%;
     grid-template-rows: repeat(9);
-}
+  }
-  #wrapper div img, #wrapper div video, #wrapper div object, #wrapper section img, #wrapper section video, #wrapper section object, #wrapper header img, #wrapper header video, #wrapper header object, #wrapper footer img, #wrapper footer video, #wrapper footer object {
+
+  #wrapper div img, 
+  #wrapper div video, 
+  #wrapper div object, 
+  #wrapper section img, 
+  #wrapper section video, 
+  #wrapper section object, 
+  #wrapper header img, 
+  #wrapper header video, 
+  #wrapper header object, 
+  #wrapper footer img, 
+  #wrapper footer video, 
+  #wrapper footer object {
     max-width: 100%;
   }
 
-header {
+  header {
     grid-column: 3 / span 4;
     grid-row: 1 / span 4;
     align-self: stretch;
     text-align: right;
-}
+  }
 
-.one {
+  .one {
     grid-column: 1 / span 2;
     grid-row: 4 / span 2;
     align-self: top;
     z-index: 3;
-}
+  }
 
-.text {
+  .text {
     grid-column: 1 / span 4;
     grid-row: 2 / span 5;
     align-self: top;
@@ -90,55 +109,60 @@ header {
     text-align: justify;
     padding: 20px 40px;
     border: thin #99FFFF dashed;
-}
+  }
 
-.work {
+  .work {
     grid-column: 2 / 6;
     grid-row: 5 / auto;
-}
+  }
 
-.work img, .work object, .work iframe {
+  .work img, .work object, .work iframe {
     display: block;
     margin: 100px auto;
     border: thin #99FFFF dashed;
-}
+  }
 
-.work img, .work object:first-of-type {
+  .work img, .work object:first-of-type {
     margin: 0px auto 100px;
-}
+  }
 
-.inPage {
+  .inPage {
     grid-row: 8 / auto;
-}
+  }
 
-.cv section:first-of-type {
+  .cv section:first-of-type {
     grid-column: 1 / 6;
     grid-row: 1 / span 1;
     padding: 0 20px;
     border: thin #99FFFF dashed;
-}
+  }
 
-.cv section:first-of-type #me {
+  .cv section:first-of-type #me {
     position: relative;
     top: 5px;
     width: 25%;
     text-align: right;
     font-style: italic;
-}
+  }
 
-.cv #edu {
+  .cv section:first-of-type #me img {
+    display: none;
+    visibility: hidden;
+  }
+
+  .cv #edu {
     grid-column: 4 / 6;
     grid-row: 2 / 3;
     align-self: center;
-}
+  }
 
-.cv #music {
+  .cv #music {
     grid-column: 1 / span 2;
     grid-row: 3 / 5;
     align-self: start;
-}
+  }
 
-.cv #things {
+  .cv #things {
     position: relative;
     top:-150px;
     left:20px;
@@ -146,24 +170,25 @@ header {
     grid-row: 2 / 5;
     align-self: center;
     padding: 0 50px 0 0;
-}
+  }
 
-.cv #prof {
+  .cv #prof {
     grid-column: 4 / 6;
     grid-row: 3 / 3;
     align-items: start;
-}
+  }
 
-.cv ul {
+  .cv ul {
     list-style-type: none;
     margin: none;
     padding: 0 0 0 7px;
-}
+  }
 
-.cv ul li {
+  .cv ul li {
     padding: 0 0 13px 0;
-}
+  }
 
-.cv ul em {
+  .cv ul em {
     padding-bottom: 7px;
+  }
 }

cv.html

@@ -5,6 +5,7 @@
 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 
+    <link rel="stylesheet" type="text/css" href="css/print.css" media="print">
     <link rel="stylesheet" type="text/css" href="css/styles.css">
 </head>
 <body>
@@ -27,6 +28,8 @@
             <em>max.e.franklin@gmail.com</em>
 
             <p>Currently based in the Paris, France teaching and performing improvised software publications.</p>
+
+            <img id="myface" src="assets/cv/Max small.png">
         </div>
     </section>
 
@@ -42,6 +45,26 @@
         Bachelor Jazz Performance (Saxophone) &amp; Creative Sound Engineering</p>
     </section>
 
+    <section id="prof">
+        <h3>Professional Experience</h3>
+
+        <p><em>Paris College of Art</em><br>
+        2014 - current // Paris, FR<br>
+        Faculty Member in Foundation, Communication Design and Master's in Transdisciplinary New Media Departments</p>
+
+        <p><em>Willem de Kooning Academie</em><br>
+        2018 // Rotterdam, NL<br>
+        Publication Station teaching and technical assistant</p>
+
+        <p><em>Freelance Graphic Designer</em><br>
+        2009 – 2014 // Sydney, AU<br>
+        Web-design, poster and album design</p>
+
+        <p><em>Linear Recording</em><br>
+        2009 – 2010 // Sydney, AU<br>
+        Assistant Sound Engineer</p>
+    </section>
+
     <section id="things">
         <h3>Things</h3>
 
@@ -125,26 +148,6 @@
         Leftfield jazz trio</p>
     </section>
 
-    <section id="prof">
-        <h3>Professional Experience</h3>
-
-        <p><em>Paris College of Art</em><br>
-        2014 - current // Paris, FR<br>
-        Faculty Member in Foundation, Communication Design and Master's in Transdisciplinary New Media Departments</p>
-
-        <p><em>Willem de Kooning Academie</em><br>
-        2018 // Rotterdam, NL<br>
-        Publication Station teaching and technical assistant</p>
-
-        <p><em>Freelance Graphic Designer</em><br>
-        2009 – 2014 // Sydney, AU<br>
-        Web-design, poster and album design</p>
-
-        <p><em>Linear Recording</em><br>
-        2009 – 2010 // Sydney, AU<br>
-        Assistant Sound Engineer</p>
-    </section>
-
    <footer>
       <p>website and server built by hand with off the shelf parts</p>
    </footer>

index.html

@@ -21,10 +21,10 @@
    </section>
 
    <section class="work">
+      <a href="soloImprovisedSoftware.html">INTERIM LINK</a>
       <a href="xpubGenerator.html"><img src="assets/imgs/xpubGenerator.jpg"></a>
       <a href="tgc3-euclid.html"><img src="assets/imgs/euclidLogo.png"></a>
       <a href="tgc3-euclid.html"><img src="assets/imgs/euclidianGenerator_mk2.png"></a>
-      <a href="polydog.html"><img src="assets/imgs/polydog.png"></a>
       <a href="repoem.html"><img src="assets/imgs/rePoem3.png"></a>
    </section>