mobile

2 files changed, 10 insertions, 4 deletions

diff --git a/docs/magisphere/index.html b/docs/magisphere/index.html
index cfb16f0..2f09abe 100644
--- a/docs/magisphere/index.html
+++ b/docs/magisphere/index.html
@@ -33,7 +33,6 @@
 <script src="/assets/js/util.js"></script>
 <script src="/assets/js/cielab.js"></script>
 <script src="/assets/js/sounds.js"></script>
-<script src="/assets/js/player.js"></script>
 <script src="/assets/js/stars.js"></script>
 <script>
 const site = (function(){
diff --git a/docs/magisphere/magisphere.css b/docs/magisphere/magisphere.css
index 9c2d760..27dd9e5 100644
--- a/docs/magisphere/magisphere.css
+++ b/docs/magisphere/magisphere.css
@@ -57,8 +57,16 @@ body.loading {
   background-color: black;
   opacity: 0;
 }
+.mobile body {
+  overflow: auto;
+}
+.mobile .content {
+  position: static;
+  top: 0; left: 0;
+  transform: translateZ(0);
+}
 .glow {
-  position: absolute;
+  position: fixed;
   top: 50%; left: 0;
   width: 100%; height: 20%;
   background-color: rgba(0,0,0,0.9);
@@ -69,7 +77,7 @@ body.loading {
   pointer-events: none;
 }
 .horizon {
-  position: absolute;
+  position: fixed;
   top: 65%; left: 0;
   width: 100%; height: 80%;
   background-color: rgba(0,0,0,1.0);
@@ -123,7 +131,6 @@ img.cover {
   transform: translate3d(-50%, -50%, 0) skewY(3deg);
   background: black;
   padding: 20px;
-
   font-family: 'alarmclock', monospace;
   color: #800;
   font-size: 32px;