TRI-283: start adaptive 1920

styles/moover/presentation.scss

@@ -1,5 +1,10 @@
 .presentation {
   margin: 20px -65px 140px;
+
+  @media (min-width: 1720px) {
+    margin-left: 0;
+    margin-right: 0;
+  }
 }
 
 .presentation__top {
@@ -7,18 +12,29 @@
   min-height: 270px;
   margin: 0 auto 116px;
   padding: 29px 0 40px;
-  background-image: url(/static/img/webp/Box9.webp),
-  url(/static/img/webp/Box10.webp),
-  url(/static/img/webp/Box11.webp),
-  url(/static/img/webp/Box12.webp);
-  background-position: top -5px left 44px,
-  top -30px right -15px,
-  bottom 70px left 276px,
-  bottom 67px right 274px;
+  background-image: url(/static/img/png/Box9.png),
+  url(/static/img/png/Box10.png),
+  url(/static/img/png/Box11.png),
+  url(/static/img/png/Box12.png);
+  background-position: top -4px left 46px,
+  top -30px right -14px,
+  bottom 73px left 278px,
+  bottom 71px right 276px;
   background-repeat: no-repeat,
   no-repeat,
   no-repeat,
   no-repeat;
+  background-size: 17.5%,21.8%,8.5%,8.8%;
+
+  @media (min-width: 1720px) {
+    background-size: 18.5%, 22%, 9%, 10.1%;
+    background-position: top -47px left 58px,
+    top -31px right 20px,
+    bottom 8px left 347px,
+    bottom -5px right 352px;
+    padding-top: 95px;
+    margin-bottom: 176px;
+  }
 }
 
 .presentation__title {

styles/moover/root.scss

@@ -1,15 +1,16 @@
 .container {
   margin: 0 auto;
-  max-width: 1280px;
+  width: 1280px;
   position: relative;
   min-height: 695px;
 }
 
-/*@media (max-width: 1339.98px) {*/
-/*  .container {*/
-/*    width: 992px*/
-/*  }*/
-/*}*/
+@media (min-width: 1720px) {
+  .container {
+    width: 1720px;
+  }
+}
+
 
 /*@media (max-width: 1019.98px) {*/
 /*  .container {*/
@@ -23,6 +24,7 @@
 /*    width: auto*/
 /*  }*/
 /*}*/
+
 :root {
   --color-primary: #FF613A;
   --color-white: #FFFFFF;
@@ -33,8 +35,6 @@
   --color-orange: #FF613A;
 
 
-  
-  
   --box-shadow-primary: -1px 4px 10px 0 rgba(198, 199, 203, 0.20),
   0 -1px 10px 0 rgba(198, 199, 203, 0.20);
   text-align: center;
@@ -46,9 +46,14 @@
 
 }
 
-h1, .title {
+h1, .h1 {
   font-size: 44px;
   line-height: 52px;
+
+  @media (min-width: 1720px) {
+    font-size: 48px;
+    line-height: 52px;
+  }
 }
 
 h2, .h2 {
@@ -58,8 +63,8 @@ h2, .h2 {
 }
 
 h3, .h3 {
-font-size: 20px;
-line-height: 28px;
+  font-size: 20px;
+  line-height: 28px;
   margin-bottom: 12px;
 }
 
@@ -105,13 +110,29 @@ b {
   margin-bottom: 13px;
   margin-left: auto;
   margin-right: auto;
+
+   @media (min-width: 1720px) {
+    font-size: 44px;
+     margin-bottom: 22px;
+  }
 }
 
 .subtitle {
   margin-bottom: 81px;
   line-height: 22px;
+
+   @media (min-width: 1720px) {
+     font-size: 20px;
+     margin-bottom: 97px;
+  }
 }
 
 .hide {
   display: none;
+}
+
+@media (min-width: 1440px) {
+  .is-container.wrapper_main {
+    max-width: initial;
+  }
 }