TRI-283: start 768>

static/css/moover/animate.css

@@ -21,6 +21,14 @@
   }
 }
 
+@media (max-width: 991.98px) {
+  .animate {
+    padding-top: 40px;
+    padding-bottom: 29px;
+    margin-bottom: 121px;
+  }
+}
+
 .animate.left {
   transform: translateX(-180px);
 }
@@ -29,9 +37,32 @@
   transform: translateX(180px);
 }
 
+.animate.right .title {
+  margin-bottom: 17px;
+}
+
 @media (min-width: 1720px) {
   .animate.right .title {
     max-width: 80%;
+    margin-bottom: 40px;
+  }
+}
+
+@media (max-width: 1304.98px) {
+  .animate.right .title {
+    margin-bottom: 25px;
+  }
+}
+
+@media (max-width: 991.98px) {
+  .animate.right .title {
+    margin-bottom: 31px;
+  }
+}
+
+@media (max-width: 991.98px) {
+  .animate.right .subtitle {
+    margin-bottom: 31px;
   }
 }
 
@@ -58,6 +89,14 @@
   }
 }
 
+@media (max-width: 991.98px) {
+  .animate .title {
+    max-width: 85%;
+    font-size: 24px;
+    line-height: 29.05px;
+  }
+}
+
 .animate .subtitle {
   width: 47%;
   margin: 0 auto 23px;
@@ -76,3 +115,10 @@
     width: 54%;
   }
 }
+
+@media (max-width: 991.98px) {
+  .animate .subtitle {
+    width: 102%;
+    margin-bottom: 26px;
+  }
+}