From a64c9676b21d432190ac68d8074cc66f30d70b53 Mon Sep 17 00:00:00 2001
From: FiliusPatris <filiuspatrisapps@gmail.com>
Date: Sun, 28 Mar 2021 00:06:20 +0100
Subject: [PATCH] Responsive down to about 315px

I'm not too sure, but I don't think there are tons of devices lower than
this width.
---
 styles/services.css | 35 +++++++++++++++++++++++++++++++++++
 styles/welcome.css  | 13 +++++++++++++
 2 files changed, 48 insertions(+)

diff --git a/styles/services.css b/styles/services.css
index 9696643..5262251 100644
--- a/styles/services.css
+++ b/styles/services.css
@@ -84,4 +84,39 @@
         margin: 0 auto;
         width: 9rem;
     }
+}
+
+/* At smaller than 520px the fonts get too large to fit in one line */
+@media only screen and (max-width: 520px) {
+    .services__heading {
+        font-size: 3.8rem;
+    }
+    .services__offers__card__heading {
+        font-size: 2.5rem;
+    }
+    .services__offers__card__description {
+        font-size: 1.1rem;
+    }
+}
+/* At smaller than 380px the fonts get too large again to fit in one line */
+@media only screen and (max-width: 380px) {
+    .welcome__text-area__description {
+        font-size: 1.7rem;
+    }
+    .services__heading {
+        font-size: 4rem;
+    }
+    .services__offers__card__heading {
+        font-size: 2.8rem;
+    }
+    .services__offers__card__description {
+        font-size: 1.3rem;
+    } 
+    .services__offers_card__button {
+        width: 14rem;
+        font-size: 1.3rem;
+    }
+    .services__offers__card__description {
+        width: 13rem;
+    } 
 }
\ No newline at end of file
diff --git a/styles/welcome.css b/styles/welcome.css
index b4d1317..e6f00c3 100644
--- a/styles/welcome.css
+++ b/styles/welcome.css
@@ -34,4 +34,17 @@
     text-align: center;
 	margin-left: 12vw;
 	margin-right: 12vw;
+}
+
+/* At smaller than 520px the fonts get too large to fit in one line */
+@media only screen and (max-width: 520px) {
+    :root {
+        font-size: .8em;
+    }
+}
+/* At smaller than 380px the fonts get too large again to fit in one line */
+@media only screen and (max-width: 380px) {
+    :root {
+        font-size: .6em;
+    }
 }
\ No newline at end of file