diff --git a/readme.MD b/readme.MD
new file mode 100644
index 0000000..68aaf3f
--- /dev/null
+++ b/readme.MD
@@ -0,0 +1,3 @@
+# Build and deploy
+- `PUBLIC_URL="bingo" npm run build` to host in the /build subdirectory
+- zip build directory, upload to server, to serve at /build
diff --git a/src/App.css b/src/App.css
index 716ce02..2e945cc 100644
--- a/src/App.css
+++ b/src/App.css
@@ -62,9 +62,19 @@ div > div.begone {
 }
 @keyframes disappear {
   0% {
+    filter: saturate(1) opacity(1);
     transform: scale(1) rotate(0deg);
   }
-  100% {
+  74% {
+    filter: saturate(1) opacity(1);
     transform: scale(0) rotate(720deg);
   }
+  75% {
+    filter: saturate(0) opacity(.1);
+    transform: scale(0) rotate(720deg);
+  }
+  100% {
+    filter: saturate(0) opacity(.1);
+    transform: scale(1) rotate(720deg);
+  }
 }
diff --git a/src/App.tsx b/src/App.tsx
index c990485..02013a5 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -76,7 +76,14 @@ const App: React.FC<{}> = () => {
       <div className="bingo-board">
       {Array.from(alphabet).map((e, index) => 
           <div key={index} >
-            <div className={ticked[index] ? "begone": undefined} onClick={() => highlight(index)} onContextMenu={(e) => {e.preventDefault(); toggleField(index);}}>
+            <div className={ticked[index] ? "begone": undefined} onClick={() => {
+              // fuck IOS not sending onContextMenu events
+              if (/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
+                toggleField(index);
+              } else {
+                highlight(index);
+              }
+            }} onContextMenu={(e) => {e.preventDefault(); toggleField(index);}}>
               <span>{e}</span>
             </div>
           </div>