From 4203ff90bd8c13a98760c8f41aa2726056b672f4 Mon Sep 17 00:00:00 2001
From: Mu-An Chiou <me@muanchiou.com>
Date: Fri, 26 Feb 2016 23:25:26 +0800
Subject: [PATCH 1/2] Use vh unit so fish size is responsive to view port
 height And fixes y scroll overflow by moving the padding to marquee

---
 index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/index.html b/index.html
index adcecc3..4b88d7f 100644
--- a/index.html
+++ b/index.html
@@ -6,7 +6,6 @@
             #fishtank {
                 width: 100%; height: 100%;
                 background-color: aqua;
-                padding: 1em 0 0;
             }
             @keyframes swimming {
               0% { transform: translateY(0); }
@@ -20,6 +19,7 @@
               animation-iteration-count: infinite;
               animation-timing-function: ease;
             }
+            marquee { font-size: 8vh; padding: 1vh 0; }
             #fish1 { color: red; animation-delay: 0; }
             #fish2 { color: orange; animation-delay: 0.8s; }
             #fish3 { color: blue; animation-delay: 0.4s; }

From e60eba99ff9c9eb97d7caf7ffc6f07329384ee92 Mon Sep 17 00:00:00 2001
From: Mu-An Chiou <me@muanchiou.com>
Date: Fri, 26 Feb 2016 23:26:27 +0800
Subject: [PATCH 2/2] Use % so it grows with font-size

---
 index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 4b88d7f..59aabb8 100644
--- a/index.html
+++ b/index.html
@@ -9,8 +9,8 @@
             }
             @keyframes swimming {
               0% { transform: translateY(0); }
-              33% { transform: translateY(-0.5em); }
-              67% { transform: translateY(0.5em); }
+              33% { transform: translateY(-50%); }
+              67% { transform: translateY(50%); }
               100% { transform: translateY(0); }
             }
             marquee:not(#crab) {