tutorial updates

client/src/styles/GLOBAL.css

@@ -197,6 +197,7 @@ button {
 }
 
 #how-to-use-container h1 {
+    color: #4b6bfa;
     font-family: signika-negative, sans-serif;
 }
 
@@ -251,11 +252,8 @@ input {
 }
 
 #how-to-use-container h3 {
-    font-size: 25px;
-}
-
-#how-to-use-container h1 {
-    font-size: 40px !important;
+    color: #b1afcd;
+    font-weight: bold;
 }
 
 .tutorial-image-small {
@@ -664,6 +662,24 @@ input {
     opacity: 0.85 !important;color:#ffffff !important;
 }
 
+@media(max-width: 550px) {
+    .how-to-use-header {
+        font-size: 25px;
+    }
+    #how-to-use-container h3 {
+        font-size: 20px;
+    }
+}
+
+@media(min-width: 551px) {
+    .how-to-use-header {
+        font-size: 40px;
+    }
+    #how-to-use-container h3 {
+        font-size: 25px;
+    }
+}
+
 
 @keyframes lds-spinner {
     0% {