Globe: Reset sizes and spacing

Temp fix

src/style/_animations.scss

@@ -7,7 +7,7 @@
     left: 0;
     width: 100%;
     height: 100%;
-    z-index: 10000;
+    z-index: 400;
     overflow: hidden;
     display: flex;
     align-items: center;

src/style/layouts/_explore.scss

@@ -14,16 +14,7 @@
 
     // Globe
     .globe {
-        margin-top: -96px;
-        margin-bottom: -160px;
 
-        @include breakpoint (sm) {
-            margin-bottom: calc(-120px - 6vw);
-        }
-        @include breakpoint (xl) {
-            margin-top: -176px;
-            margin-bottom: -240px;
-        }
     }
 
     // Browse

src/style/molecules/_globe.scss

@@ -3,18 +3,12 @@
     position: relative;
     z-index: 2;
     width: 100vw;
-    height: 1040px;
+    height: 100vh;
     overflow: hidden;
     cursor: grab;
+    // pointer-events: none;
     user-select: none;
 
-    @include breakpoint (sm) {
-        height: 140vw;
-    }
-    @include breakpoint (xl) {
-        height: 2000px;
-    }
-
     // Cut
     &__cut {
         opacity: 0.5;
@@ -23,11 +17,6 @@
         height: 35vw;
         min-height: 400px;
         padding: 0;
-
-        // Partial globe
-        .globe {
-            margin-top: -18vw;
-        }
     }
 
     // Marker
@@ -42,10 +31,12 @@
         height: 8px;
         border-radius: 100%;
         opacity: 1;
+        pointer-events: auto;
         background: #ff6c89;
         will-change: transform;
 
         span {
+            pointer-events: auto;
             transition: color 0.4s $ease-quart;
         }
 

src/style/pages/_homepage.scss

@@ -80,14 +80,7 @@
 
     // Globe
     .globe {
-        margin-bottom: calc(-200px - 8vw);
 
-        @include breakpoint (sm) {
-            margin-bottom: calc(-100px - 28vw);
-        }
-        @include breakpoint (xl) {
-            margin-bottom: -550px;
-        }
     }
 
     // Browse

src/style/pages/_page.scss

@@ -93,6 +93,6 @@
 
     // Globe
     .globe__cut {
-        margin-top: 8vw;
+
     }
 }