Styling for elements on the landingpage

src/components/VinlottisPage.vue

@@ -65,6 +65,11 @@ export default {
 
 .left-bottom {
   width: 75%;
+
+  @include mobile {
+    padding: 0 1.25rem;
+    width: 100%;
+  }
 }
 
 .bought-and-highscore-separator {
@@ -180,7 +185,7 @@ h1 {
     justify-content: center;
     align-items: center;
 
-    padding-top: 0;
+    padding: 0;
     margin-top: 30px;
   }
 

src/ui/TotalBought.vue

@@ -106,6 +106,12 @@ export default {
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
+
+  @include mobile {
+    flex-direction: row;
+    justify-content: unset;
+    align-items: center;
+  }
 }
 
 .number-container {
@@ -120,6 +126,12 @@ export default {
 
 .inner-text-container {
   padding-left: 5px;
+
+  // TODO fix styling for displaying in columns
+  @include mobile {
+    margin-top: auto;
+    padding-bottom: 5px;
+  }
 }
 
 .bought-number-span {