From f2086fa31518390542d48a44f70fadcf89178b34 Mon Sep 17 00:00:00 2001
From: ManjaroOne666 <git@gabbaell.co.uk>
Date: Wed, 23 Jan 2019 17:27:42 +0000
Subject: [PATCH] services list styling layout

---
 pages/services.vue | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/pages/services.vue b/pages/services.vue
index f469bc7..bcf1a10 100644
--- a/pages/services.vue
+++ b/pages/services.vue
@@ -15,7 +15,7 @@
           <h2 class="services-list__heading service-heading">{{ service.heading }}</h2>
           <div class="services-list__body" v-html="service.html">
           </div>
-          <a class="services-list__gallery-link" :href="service.linkUrl">My {{ service.heading }}</a>
+          <a class="btn-link services-list__gallery-link" :href="service.linkUrl">My {{ service.heading }}</a>
         </div>
       </li>
     </ul>
@@ -105,7 +105,10 @@ export default {
 
       .services-list__body {
         align-self: flex-end;
-        text-align: right;
+
+        @media (min-width: $bp__layout) {
+          text-align: right;
+        }
       }
     }
 
@@ -128,6 +131,14 @@ export default {
         left: auto;
         right: 2rem;
       }
+
+      .services-list__body {
+        text-align: right;
+
+        @media (min-width: $bp__layout) {
+          text-align: left;
+        }
+      }
     }
 
     &:first-child {
@@ -157,10 +168,13 @@ export default {
     flex-direction: column;
     justify-content: space-between;
     min-height: 20em;
+
+    padding-bottom: 1rem;
   }
 
   .services-list__body {
     width: 100%;
+    color: $color__neutral-800;
 
     @media (min-width: $bp__layout) {
       width: 80%;