Enable RWD on pricing section

Enable RWD for testimonials

src/index.html

@@ -329,8 +329,8 @@
     <div class="pricing">
         <p class="pricing__title">Fork Subscription Pricing</p>
         <div class="container">
-            <div class="row">
-                <div class="col-3">
+            <div class="row justify-content-center">
+                <div class="col-8 col-xl-3">
                     <div class="price">
                         <p class="price__title">Students</p>
                         <p class="price__value">$29</p>
@@ -342,7 +342,7 @@
                         </a>
                     </div>
                 </div>
-                <div class="col-3">
+                <div class="col-8 col-xl-3">
                     <div class="price">
                         <p class="price__title">Professional</p>
                         <p class="price__value">$59</p>
@@ -354,7 +354,7 @@
                         </a>
                     </div>
                 </div>
-                <div class="col-3">
+                <div class="col-8 col-xl-3">
                     <div class="price">
                         <p class="price__title">Agency</p>
                         <p class="price__value">$99</p>
@@ -366,7 +366,7 @@
                         </a>
                     </div>
                 </div>
-                <div class="col-3">
+                <div class="col-8 col-xl-3">
                     <div class="price">
                         <p class="price__title">Enterprise</p>
                         <p class="price__value">$159</p>

src/scss/_pricing.scss

@@ -21,12 +21,19 @@
   height: 450px;
   transition: $hover-duration;
 
+  @media all and (max-width: $desktop-xl) {
+    margin-top: 7px;
+    margin-bottom: 7px;
+  }
+
   &:hover {
-    margin-top: 70px;
-    margin-bottom: 75px;
+    @media all and (min-width: $desktop-xl) {
+      margin-top: 70px;
+      margin-bottom: 75px;
+      height: 530px;
+    }
     background-color: rgba(0, 0, 0, 0.06);
     transition: $hover-duration;
-    height: 530px;
 
     & > .price__title {
       background-color: rgba(0, 0, 0, 0.06);
@@ -88,8 +95,13 @@
   padding-bottom: 10px;
   background-color: rgba(255, 255, 255, 0.15);
   position: absolute;
+  left: 0;
+  text-align: center;
+  right: 0;
   bottom: 35px;
-  left: 20%;
+  margin: auto;
+  display: block;
+  width: 80%;
   font-family: Montserrat, sans-serif;
   font-weight: 500;
   font-size: 16px;