responsivity update

resources/js/components/Index/Components/PricingTables.vue

@@ -70,6 +70,7 @@
         .plan-header {
 
             .icon {
+
                 path, line, polyline, rect, circle {
                     color: $theme;
                 }
@@ -122,7 +123,6 @@
     .plans-wrapper {
         display: flex;
         flex-wrap: wrap;
-        margin: 0 -25px;
         justify-content: center;
     }
 

resources/js/components/Index/IndexGetStarted.vue

@@ -316,6 +316,12 @@
         }
     }
 
+    @media only screen and (max-width: 1190px) {
+        .get-started-button {
+            margin-bottom: 280px;
+        }
+    }
+
     @media only screen and (max-width: 960px) {
         .page-title {
             padding-top: 20px;

resources/js/components/Index/IndexMainFeatures.vue

@@ -132,29 +132,30 @@
 
     @media only screen and (max-width: 1190px) {
 
-        .content {
-            display: block;
-        }
-
         .hero {
+            flex: 0 0 60%;
+
             img {
                 width: 100%;
             }
         }
 
         .features {
-            padding-left: 0;
-            margin-top: 50px;
+            padding-left: 25px;
+            margin-top: 0px;
         }
     }
 
     @media only screen and (max-width: 960px) {
 
         .content {
+            display: block;
             margin-top: 40px;
         }
 
         .features {
+            margin-top: 50px;
+
             .feature {
                 margin-bottom: 35px;
 

resources/js/components/Index/IndexPricingTables.vue

@@ -135,12 +135,20 @@
         display: block;
     }
 
-    @media only screen and (max-width: 960px) {
+    @media only screen and (max-width: 1190px) {
 
         .cloud-bg {
             display: none;
         }
 
+        .pricing {
+            padding-top: 150px;
+            padding-bottom: 60px;
+        }
+    }
+
+    @media only screen and (max-width: 960px) {
+
         .page-title {
 
             .title {