Title and other CSS fixes

src/organisms/Locations.svelte

@@ -46,7 +46,6 @@
     onMount(() => {
 
     })
-
 </script>
 
 <div class="browse wrap">

src/style/_base.scss

@@ -101,19 +101,24 @@ button {
 
     // Bigger version
     &--big {
-        font-size: rem(56px);
+        font-size: rem(40px);
 
+        @include breakpoint (m) {
+            font-size: rem(56px);
+        }
         @include breakpoint (sm) {
+            font-size: pxVW(160);
+        }
+        @include breakpoint (md) {
             font-size: rem(160px);
         }
 
         em {
             display: inline-block;
-            font-size: rem(20px);
+            font-size: 0.35em;
 
-            @include breakpoint (sm) {
+            @include breakpoint (md) {
                 margin-left: -8px;
-                font-size: rem(56px);
             }
         }
     }
@@ -121,11 +126,21 @@ button {
     // Inline version
     &--inline {
         display: flex;
-        align-items: baseline;
+        flex-direction: column;
+        align-items: center;
         justify-content: center;
 
         em {
-            margin: 0 16px 0 24px;
+            margin: 8px 0 4px;
+
+            @include breakpoint (sm) {
+                margin: 2px 16px 0 24px;
+            }
+        }
+
+        @include breakpoint (sm) {
+            flex-direction: row;
+            align-items: baseline;
         }
     }
 }

src/style/atoms/_link.scss

@@ -3,24 +3,33 @@
     position: relative;
     display: inline-block;
     margin: 0 6px;
-    padding: 0 8px;
+    padding: 0 4px;
     color: $color-secondary;
     text-decoration: none;
     transition: color 200ms $ease-cubic;
 
+    @include breakpoint (sm) {
+        padding: 0 8px;
+    }
+
     // Line
     &:after {
         content: "";
         position: absolute;
         z-index: -1;
         background-color: rgba($color-secondary, 0.22);
-        height: 14px;
         width: 100%;
-        bottom: 5px;
+        height: 8px;
+        bottom: 3px;
         left: 0;
         border-radius: 50vh;
         transition: all 200ms $ease-cubic;
         transition-delay: 50ms;
+
+        @include breakpoint (sm) {
+            height: 14px;
+            bottom: 5px;
+        }
     }
 
     // Icon

static/img/icons/zoom.svg

@@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="36" height="36">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32">
   <path fill="#fff" id="b" d="M11.996 0c6.615 0 11.996 5.381 11.996 11.996 0 2.857-1.005 5.482-2.678 7.545l6.176 6.176a1.253 1.253 0 1 1-1.773 1.772l-6.176-6.176a11.939 11.939 0 0 1-7.545 2.68C5.381 23.992 0 18.61 0 11.995S5.381 0 11.996 0zm0 2.507c-5.232 0-9.489 4.257-9.489 9.49 0 5.231 4.257 9.488 9.49 9.488 5.231 0 9.488-4.257 9.488-9.489 0-5.232-4.257-9.489-9.489-9.489zm0 4.552c.693 0 1.254.56 1.254 1.253v2.43h2.43a1.254 1.254 0 1 1 0 2.508h-2.43v2.43a1.254 1.254 0 1 1-2.507 0v-2.43H8.312a1.254 1.254 0 1 1 0-2.508h2.43v-2.43c0-.692.561-1.253 1.254-1.253z"/>
 </svg>