global and media-queries styles sheets

src/styles/global.scss

@@ -0,0 +1,29 @@
+@import './media-queries.scss';
+
+body {
+  font-family: Arial;
+}
+
+.title {
+  text-align: center;
+  width: 100vw;
+  text-align: center;
+  font-family: knowit;
+  margin-top: 3.8rem;
+  font-weight: 600;
+
+  @include mobile {
+    margin-top: 1.5rem;
+    font-size: 1.6rem;
+  }
+}
+
+.subtext {
+  margin-top: 0.5rem;
+  font-size: 1.22rem;
+
+  @include mobile {
+    margin-top: 0;
+    font-size: 1.15rem;
+  }
+}

src/styles/media-queries.scss

@@ -0,0 +1,18 @@
+$phone-xs-width: 480px;
+$tablet-p-width: 768px;
+$tablet-l-width: 1024px;
+$desktop-width:  1200px;
+$desktop-l-width: 1600px;
+$mobile-width: 768px;
+
+@mixin desktop {
+  @media (min-width: #{$mobile-width + 1px}) {
+    @content;
+  }
+}
+
+@mixin mobile {
+  @media (max-width: #{$mobile-width}) {
+    @content;
+  }
+}