wip(sreez): initial offer landing page improving

sreez/style/main.scss

@@ -1,22 +1,25 @@
 body {
 	font-family: sans-serif;
 	text-align: center;
-  font-size: 1.25rem;
+  font-size: 1.4rem;
 }
 
 body {
-  background-color: #FAFAF5;
   font-family: Roboto, helvetica;
   font-family: Poppins, helvetica;
 }
 
 
-.font-size-4xl {
+.font-4xl {
   font-size: 3rem;
 }
 
-.font-size-xl {
-  font-size: 1.5rem;
+.font-xl {
+  font-size: 1.7rem;
+}
+
+.line-1 {
+  line-height: 1rem;
 }
 
 .color-gray {
@@ -32,6 +35,10 @@ ol {
   flex-direction: row;
 }
 
+.wrap {
+  flex-wrap: wrap;
+}
+
 .column {
   display: flex;
   flex-direction: column;
@@ -88,12 +95,6 @@ ol {
     flex: 1;
     min-width: 250px;
     max-width: 400px;
-    // border: solid 3px #ccc;
-    //border-radius: 20px;
-    // background-color: white;
-    //border: 2px solid #eee;
-    //border-right: 2px solid #fc314e88;
-    //border-left: 2px solid #fc314e88;
     margin: 30px;
     display: flex;
     flex-direction: column;
@@ -152,22 +153,29 @@ ol.huge-list-markers li{
   }
 }
 
+@media (min-width: 900px) {
 .text-2x {
   font-size: 2rem;
 }
 
 .text-3x {
-  font-size: 3rem;
+  font-size: 3.5rem;
 }
 
 .text-4x {
   font-size: 4rem;
 }
+}
 
 .font-bold {
   font-weight: 800;
 }
 
+.font-600 {
+  font-weight: 600;
+}
+
+
 .max-width-400 {
   max-width: 400px;
 }
@@ -175,3 +183,25 @@ ol.huge-list-markers li{
 .height-110 {
   height: 110px;
 }
+
+.bg-light, body {
+  background-color: #F8F9F1;
+}
+
+.btn-dark {
+  background-color: #007488;
+  color: #FFF;
+}
+
+.btn {
+  border: none;
+  padding: 0.7rem 1rem;
+  border-radius: 0.75rem;
+  font-weight: 700;
+  font-size: inherit;
+  text-transform: capitalize;
+  cursor: pointer;
+  &:hover {
+    background-color: #007488CC;
+  }
+}