Better compass arrow

public/css/index-tailwind-output.css

@@ -729,14 +729,6 @@ video {
   bottom: 0px;
 }
 
-.top-1\/2 {
-  top: 50%;
-}
-
-.left-1\/2 {
-  left: 50%;
-}
-
 .right-4 {
   right: 1rem;
 }
@@ -1126,10 +1118,6 @@ video {
   height: 0px;
 }
 
-.h-5 {
-  height: 1.25rem;
-}
-
 .h-4 {
   height: 1rem;
 }
@@ -1150,6 +1138,10 @@ video {
   height: 2.75rem;
 }
 
+.h-5 {
+  height: 1.25rem;
+}
+
 .h-48 {
   height: 12rem;
 }
@@ -1240,10 +1232,6 @@ video {
   width: 0px;
 }
 
-.w-5 {
-  width: 1.25rem;
-}
-
 .w-4 {
   width: 1rem;
 }
@@ -1272,6 +1260,10 @@ video {
   width: auto;
 }
 
+.w-5 {
+  width: 1.25rem;
+}
+
 .w-10 {
   width: 2.5rem;
 }
@@ -1346,10 +1338,6 @@ video {
   cursor: pointer;
 }
 
-.cursor-wait {
-  cursor: wait;
-}
-
 .resize {
   resize: both;
 }
@@ -1745,11 +1733,6 @@ video {
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
 }
 
-.bg-red-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(239 68 68 / var(--tw-bg-opacity));
-}
-
 .bg-white\/50 {
   background-color: rgb(255 255 255 / 0.5);
 }
@@ -2756,6 +2739,18 @@ a.link-underline {
   overflow: visible !important;
 }
 
+.compass_arrow {
+  width: calc( 2.5rem - 1px ) ;
+  height: calc( 2.5rem - 1px )
+}
+
+@media (min-width: 640px) {
+  .compass_arrow {
+    width: calc( 2.75rem - 1px ) ;
+    height: calc( 2.75rem - 1px )
+  }
+}
+
 @-webkit-keyframes glowing-drop-shadow {
   from {
     -webkit-filter: drop-shadow(5px 5px 60px rgb(128 128 128 / 0.6));
@@ -2863,6 +2858,10 @@ a.link-underline {
     margin: 0.5rem;
   }
 
+  .sm\:m-1 {
+    margin: 0.25rem;
+  }
+
   .sm\:mx-1 {
     margin-left: 0.25rem;
     margin-right: 0.25rem;