Edit browse locations section

Create badge atom,

src/style/atoms/_badge.scss

@@ -0,0 +1,22 @@
+.badge {
+    display: flex;
+    align-items: center;
+    margin: 0 auto;
+    padding: 0 6px;
+    background-color: $color-secondary-light;
+    border-radius: 100vh;
+    text-transform: uppercase;
+    color: $color-primary-darker;
+    font-weight: 500;
+    letter-spacing: 1px;
+    line-height: 1;
+    min-height: 16px;
+    margin-top: 20px;
+
+    // Small size
+    &--small {
+        span {
+            font-size: rem(7px);
+        }
+    }
+}

src/style/molecules/_location.scss

@@ -1,7 +1,16 @@
 .location {
     text-align: center;
+
+    & > * {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+    }
+
     // Flag
     img {
+        display: block;
+        margin: 0 auto;
         border-radius: 100%;
     }
     // Link
@@ -17,7 +26,8 @@
         font-weight: 300;
         line-height: 1.2;
     }
-    span {
+    &__country {
         color: $color-tertiary;
     }
+
 }

src/style/organisms/_locations.scss

@@ -1,9 +1,21 @@
 .browse {
 
+    // Description
     &__description {
         text-align: center;
+        margin-bottom: 56px;
     }
 
+    // Continents
+    &__continents {
+        text-align: center;
+
+        button {
+            margin: 0 8px;
+        }
+    }
+
+    // Locations
     &__locations {
         display: flex;
         flex-flow: row wrap;

src/style/style.scss

@@ -24,6 +24,7 @@
 // Atomic Design System
 // Atoms
 @import "atoms/button";
+@import "atoms/badge";
 
 // Molecules
 @import "molecules/photo-card";