X-Git-Url: http://gitweb.michael.orlitzky.com/?a=blobdiff_plain;f=src%2Findex.html.in;h=b3407fc214e70b9c9607d767b01dfe1b5451d2d5;hb=07e4fcda42d8e906d45ceebc7d86c0e121755339;hp=19c39ef3569d44d4284e3ef230a46e343196c098;hpb=039d2c876b1dd3b05a5dd81ac361cfab2ccef72a;p=charm-bypass.git

diff --git a/src/index.html.in b/src/index.html.in
index 19c39ef..b3407fc 100644
--- a/src/index.html.in
+++ b/src/index.html.in
@@ -46,13 +46,23 @@
       /* Define, load, and specify the custom font we use for the ticket
        * date, time, and service name. */
       @font-face {
-	font-family: "CharmBypass Ticket Text";
+	font-family: "CharmBypass Regular";
 	src:
-	  url("data:font/woff2;base64,@TICKETFONT@") format("woff2")
+	  url("data:font/woff2;base64,@CBPREGULAR@") format("woff2")
       }
 
       #servicename, #tickettime, #ticketdate {
-        font-family: "CharmBypass Ticket Text" !important;
+        font-family: "CharmBypass Regular";
+      }
+
+      @font-face {
+	font-family: "CharmBypass Bold";
+	src:
+	  url("data:font/woff2;base64,@CBPBOLD@") format("woff2")
+      }
+
+      #serviceletter {
+	font-family: "CharmBypass Bold";
       }
 
       /************************/
@@ -70,7 +80,7 @@
       }
 
       #bus {
-	animation: busroll 20s linear infinite;
+	animation: busroll 23s linear infinite;
       }
 
 
@@ -85,7 +95,7 @@
       }
 
       #tram {
-	animation: tramroll 15s linear infinite;
+	animation: tramroll 17s linear infinite;
       }
 
 
@@ -100,7 +110,7 @@
       }
 
       #train {
-	animation: trainroll 10s linear infinite;
+	animation: trainroll 11s linear infinite;
       }
 
 
@@ -160,6 +170,38 @@
         /* The trees move a little faster than the clouds */
 	animation: treescopypass 30s linear infinite;
       }
+
+
+      /* City skyline */
+      @keyframes cityscroll {
+	from {
+	  transform: translateX(0%);
+	}
+	to {
+	  transform: translateX(-50%);
+	}
+      }
+
+      #city {
+        /* The city moves faster than the clouds but slower
+         * than the trees */
+	animation: cityscroll 35s linear infinite;
+      }
+
+      @keyframes citycopyscroll {
+	from {
+	  transform: translateX(0%);
+	}
+	to {
+	  transform: translateX(-50%);
+	}
+      }
+
+      #citycopy {
+        /* The city moves faster than the clouds but slower
+         * than the trees */
+	animation: citycopyscroll 35s linear infinite;
+      }
     </style>
   </head>
 
@@ -192,7 +234,7 @@
       tt = document.getElementById("tickettime");
       tt.firstChild.textContent = date.toLocaleTimeString();
 
-      td = document.getElementById("ticketdate");
+      const td = document.getElementById("ticketdate");
       const dateopts = {
 	day: "2-digit",
 	month: "2-digit",