index.html.in: use less vertical (white)space for keyframes

diff --git a/index.html.in b/index.html.in
index dae2c048c8efae9d68635e20bc3ca9b64bd8bba4..abb65fcb3fb27a47dfa9c093e908433104d3380c 100644 (file)
--- a/index.html.in
+++ b/index.html.in
@@ -28,7 +28,7 @@
 
       svg {
         /* Set the height to 100% of the screen, which we'll keep; and the
-         *  initial position to (0,0), which we're going to change
+         * initial position to (0,0), which we're going to change
          * every time the window is resized, because the exact amount
          * that we have to slide the SVG to the left to get the ticket
          * into the center will change. */
@@ -44,15 +44,9 @@
 
       /* The blinking fade in/out animation for the ticket date and time */
       @keyframes blink {
-        25% {
-          opacity: 0.5;
-        }
-        50% {
-          opacity: 0;
-        }
-        75% {
-          opacity: 0.5;
-        }
+        25% { opacity: 0.5; }
+        50% { opacity: 0;   }
+        75% { opacity: 0.5; }
       }
 
       #tickettime, #ticketdate {
@@ -88,12 +82,8 @@
 
       /* Bus */
       @keyframes busroll {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(-100%);
-        }
+        from { transform: translateX(0%);    }
+        to   { transform: translateX(-100%); }
       }
 
       #bus {
@@ -103,12 +93,8 @@
 
       /* Tram */
       @keyframes tramroll {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(100%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(100%); }
       }
 
       #tram {
@@ -118,12 +104,8 @@
 
       /* Tram */
       @keyframes trainroll {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(100%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(100%); }
       }
 
       #train {
@@ -133,12 +115,8 @@
 
       /* Clouds */
       @keyframes cloudsfloat {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(-50%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(-50%); }
       }
 
       #clouds {
@@ -146,12 +124,8 @@
       }
 
       @keyframes cloudscopyfloat {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(-50%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(-50%); }
       }
 
       #cloudscopy {
@@ -161,12 +135,8 @@
 
       /* Trees */
       @keyframes treespass {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(-50%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(-50%); }
       }
 
       #trees {
@@ -175,12 +145,8 @@
       }
 
       @keyframes treescopypass {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(-50%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(-50%); }
       }
 
       #treescopy {
@@ -191,12 +157,8 @@
 
       /* City skyline */
       @keyframes cityscroll {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(-50%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(-50%); }
       }
 
       #city {
@@ -206,12 +168,8 @@
       }
 
       @keyframes citycopyscroll {
-        from {
-          transform: translateX(0%);
-        }
-        to {
-          transform: translateX(-50%);
-        }
+        from { transform: translateX(0%);   }
+        to   { transform: translateX(-50%); }
       }
 
       #citycopy {