chore(docs): add max width and center content

edenia · Dec 14, 2022 · d50b493 · d50b493
1 parent 57e6d4d
commit d50b493
Showing 1 changed file with 13 additions and 20 deletions.
diff --git a/docs/styles.css b/docs/styles.css
@@ -1298,7 +1298,7 @@ p {
   }
 }
 
-@media screen and (min-width: 1766px) {
+@media screen and (min-width: 1920px) {
   .section-wrapper {
     width: 100%;
   }
@@ -1307,18 +1307,18 @@ p {
     z-index: 2;
     position: relative;
     height: 780px;
+    max-width: 1800px;
     background-image: url(./images/bgimage.png);
-    background-size: 1200px 780px;
+    background-size: 800px 780px;;
     background-position: top right;
     background-repeat: no-repeat;
     align-items: flex-start;
-    margin-left: 15%;
-    margin-right: 15%;
+    margin-left: calc(100% / 2 - 900px);
   }
 
   .box-network {
-    margin-left: 15%;
-    margin-right: 15%;
+    max-width: 1800px;
+    margin-left: calc(100% / 2 - 900px);
   }
   #middle-logo {
     width: 546px;
@@ -1351,12 +1351,12 @@ p {
   }
 
   .flex p {
-    width: 534.5px;
+    width: 700px;
     height: 71.3px;
     flex-grow: 0;
     margin: 0 0 0 6.5px;
     font-family: Nunito;
-    font-size: 22px;
+    font-size: 32px;
     font-weight: 600;
     font-stretch: normal;
     font-style: normal;
@@ -1481,13 +1481,6 @@ p {
     margin-top: 78px;
   }
 
-  #divider-line {
-    width: 100%;
-    height: 6px;
-    transform: rotate(-360deg);
-    background-color: #8de5ff;
-  }
-
   .grid {
     display: flex;
     grid-template-columns: repeat(6, 1fr);
@@ -1500,7 +1493,7 @@ p {
     margin-right: auto;
     display: block;
     width: 60%;
-    height: 70%;
+    height: 60%;
   }
 
   .grid-item {
@@ -1541,8 +1534,8 @@ p {
   details summary:after {
     content: url(./images/chevron-down.png);
     position: absolute;
-    right: 8%;
     transform: rotate(180deg);
+    margin-right: calc(100% / 2 - 1000px);
   }
 
   .box-paragraph summary {
@@ -1557,7 +1550,7 @@ p {
     letter-spacing: -0.54px;
     text-align: left;
     color: #000;
-    padding-left: 10%;
+    padding-left: calc(100% / 2 - 1000px);
   }
 
   .box-paragraph p {
@@ -1580,8 +1573,8 @@ p {
     display: flex;
     align-items: center;
     flex-direction: column;
-    padding-left: 20%;
-    padding-right: 20%;
+    padding-left: calc(100% / 2 - 900px);
+    padding-right: calc(100% / 2 - 900px);
   }
 
   .logo-text {