From f30f9c5a9668b509a013366f157c9bee99aa2f56 Mon Sep 17 00:00:00 2001
From: HaudinFlorence <haudin.florence@gmail.com>
Date: Wed, 10 Jul 2024 19:07:49 +0200
Subject: [PATCH] Remove most of the media queries in the various css files.

---
 src/components/about/FourValues.tsx           |  21 +-
 src/components/about/styles.module.css        |  14 +-
 src/components/blog/styles.module.css         |  11 +-
 src/components/careers/styles.module.css      |  63 ----
 src/components/contact/styles.module.css      |  71 ++---
 src/components/home/AboutQS/styles.module.css |  23 +-
 src/components/home/Hero/styles.module.css    |  69 ++---
 .../home/LearnMore/styles.module.css          |  41 +--
 src/components/home/News/styles.module.css    |  24 +-
 .../home/ProjectsOverview/Robotics copy.tsx   |  30 ++
 .../home/ProjectsOverview/Robotics.tsx        |  26 +-
 .../home/ProjectsOverview/SupplyChain.tsx     |  23 +-
 .../ProjectsOverview/SupplyChainReversed.tsx  |  35 +++
 .../home/ProjectsOverview/styles.module.css   |  28 +-
 .../home/WhatWeDo/styles.module.css           |  83 ++----
 src/components/projects/ProjectCard.tsx       |   2 +-
 .../projects/styles.module copy.css           | 199 +++++++++++++
 src/components/projects/styles.module.css     | 279 ++++++------------
 src/components/services/styles.module.css     |  43 ---
 src/css/custom.css                            | 167 +++--------
 20 files changed, 548 insertions(+), 704 deletions(-)
 create mode 100644 src/components/home/ProjectsOverview/Robotics copy.tsx
 create mode 100644 src/components/home/ProjectsOverview/SupplyChainReversed.tsx
 create mode 100644 src/components/projects/styles.module copy.css

diff --git a/src/components/about/FourValues.tsx b/src/components/about/FourValues.tsx
index 0e24eb328..0d9615afc 100644
--- a/src/components/about/FourValues.tsx
+++ b/src/components/about/FourValues.tsx
@@ -2,25 +2,32 @@ import styles from "./styles.module.css";
 import { ValueCard } from "@site/src/components/about/ValueCard";
 import { valuesDetails } from "./Values/valuesDetails";
 
-
 export default function FourValues() {
   return (
     <div className={styles.four_values_container}>
       <div className="row">
         <div className="col">
-          <h1 className={"padding-none" + " "+ "full-flex-centered"}>Our values </h1>
+          <h1 className={"padding-none" + " " + "full-flex-centered"}>
+            Our values{" "}
+          </h1>
         </div>
       </div>
       <ul
-        className={"row" + " " + "padding-none" + " " + styles.row_with_margins+" "+ "flex-full-centered"}
+        className={
+          "row" +
+          " " +
+          "padding-none" +
+          " " +
+          styles.row_with_margins +
+          " " +
+          "flex-full-centered"
+        }
       >
         {valuesDetails.map((value, index) => (
           <li className="cards-list" key={index}>
             <div className="col">
               <div className={styles.value_card_container}>
-                <ValueCard
-                  value={value}
-                />
+                <ValueCard value={value} />
               </div>
             </div>
           </li>
@@ -28,4 +35,4 @@ export default function FourValues() {
       </ul>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/components/about/styles.module.css b/src/components/about/styles.module.css
index 1e8fe5aff..f46912d4b 100644
--- a/src/components/about/styles.module.css
+++ b/src/components/about/styles.module.css
@@ -29,9 +29,9 @@
   line-height: 28px;
   text-align: center;
 }
-@media only screen and (max-width: 996px) {
+/*@media only screen and (max-width: 996px) {
   /* mobile */
-  .h2_custom {
+  /*.h2_custom {
     padding: var(--ifm-spacing-lg) var(--ifm-spacing-2xl);
   }
 
@@ -61,7 +61,7 @@
     font-size: 12px;
     font-style: normal;
     font-weight: 400;
-    line-height: 20px; /* 142.857% */
+    line-height: 20px; 
     letter-spacing: 0.25px;
   }
 
@@ -93,13 +93,13 @@
     font-size: var(--ifm--font-size-normal);
     font-style: normal;
     font-weight: 400;
-    line-height: 24px; /* 133.333% */
+    line-height: 24px;
     letter-spacing: 0.5px;
     padding: var(--ifm-spacing-4xl) var(--ifm-spacing-2xl);
   }
 }
-
-@media only screen and (min-width: 996px) {
+*/
+/*@media only screen and (min-width: 996px) {
   /* Desktop */
   .value_header {
     font-family: var(--ifm-font-family-rubik-one);
@@ -274,4 +274,4 @@
   div .join_the_team_text {
     color: var(--ifm-text-color-blue-banner);
   }
-}
+/*}*/
diff --git a/src/components/blog/styles.module.css b/src/components/blog/styles.module.css
index 869255f4b..10cca20fa 100644
--- a/src/components/blog/styles.module.css
+++ b/src/components/blog/styles.module.css
@@ -90,13 +90,6 @@ div .blogpost_date {
     var(--ifm-spacing-lg);
 }
 
-@media only screen and (max-width: 996px) {
-  /*Mobile */
-}
-
-@media only screen and (min-width: 996px) {
-  /*Desktop */
-  .blogposts_container {
-    margin: var(--ifm-spacing-6xl) 0;
-  }
+.blogposts_container {
+  margin: var(--ifm-spacing-6xl) 0;
 }
diff --git a/src/components/careers/styles.module.css b/src/components/careers/styles.module.css
index c4b919845..01c9eae6b 100644
--- a/src/components/careers/styles.module.css
+++ b/src/components/careers/styles.module.css
@@ -38,67 +38,6 @@ div .learn_more_WTJ {
   font-weight: 700;
 }
 
-@media only screen and (max-width: 400px) {
-  /*Mobile */
-  .careers_container {
-    margin-top: var(--ifm-spacing-2xl);
-  }
-
-  .join_the_team_text {
-    text-align: center;
-    font-size: 12px;
-    font-family: var(--ifm-font-family-roboto);
-    color: var(--ifm-color-primary-p2);
-    text-align: center;
-    font-style: normal;
-    font-weight: 400;
-    padding: var(--ifm-spacing-xl) var(--ifm-spacing-2xl);
-  }
-
-  .interview_card {
-    width: 300px;
-    height: 270px;
-    background-color: var(--ifm-background-color);
-    border-radius: 10px;
-    box-shadow: 0px 0px 8px 1px #c8c8c7;
-    padding: var(--ifm-spacing-sm);
-    text-align: center;
-    margin-bottom: var(--ifm-spacing-xl);
-  }
-
-  .interview_name {
-    color: var(--ifm-text-color);
-    text-align: center;
-    font-family: var(--ifm-font-family-roboto);
-    font-size: 20px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 36px; /* 128.571% */
-  }
-
-  .interview_position {
-    color: var(--ifm-text-color);
-    text-align: center;
-    font-family: var(--ifm-font-family-roboto);
-    font-size: 12px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 24px; /* 133.333% */
-    letter-spacing: 0.5px;
-  }
-
-  .WTJ_profile_container {
-    margin-top: var(--ifm-spacing-2xl);
-    background-color: var(--ifm-background-color-blue-banner);
-    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-2xl);
-    font-family: var(--ifm-font-family-roboto);
-    font-size: 16px;
-    text-align: center;
-  }
-}
-
-@media only screen and (min-width: 400px) {
-  /*Desktop */
   .careers_container {
     margin-top: var(--ifm-spacing-6xl);
   }
@@ -178,5 +117,3 @@ div .learn_more_WTJ {
     line-height: 150%; /* 72px */
     letter-spacing: 2.112px;
   }
-
-}
diff --git a/src/components/contact/styles.module.css b/src/components/contact/styles.module.css
index 8b78f75b3..bea120f56 100644
--- a/src/components/contact/styles.module.css
+++ b/src/components/contact/styles.module.css
@@ -1,4 +1,3 @@
-
 .send_button {
   width: 258px;
   height: 59px;
@@ -10,57 +9,27 @@
   width: 508px;
   margin-top: var(--ifm-spacing-2xl);
 }
-
-@media only screen and (max-width: 996px) {
-  /*Mobile */
-  .contact_container {
-    margin: var(--ifm-spacing-5xl) 0;
-    text-align: center;
-  }
-
-  .form_label {
-    font-size: 12px;
-    color: var(---ifm-text-color);
-    background-color: var(--ifm-color-orange-light);
-  }
-
-  .small_input {
-    width: 297px;
-    height: 56px;
-    border-radius: 4px;
-  }
-
-  .large_input {
-    width: 297px;
-    height: 220px;
-    border-radius: 4px;
-  }
+.contact_container {
+  margin: var(--ifm-spacing-5xl) 0;
 }
 
-@media only screen and (min-width: 996px) {
-  /*Desktop */
-  .contact_container {
-    margin: var(--ifm-spacing-5xl) 0;
-  }
-
-  .contact_form {
-    margin-top: var(--ifm-spacing-xl);
-  }
+.contact_form {
+  margin-top: var(--ifm-spacing-xl);
+}
 
-  .form_label {
-    font-size: 12px;
-    color: var(--ifm-text-color);
-    background-color: var(--ifm-background-color);
-  }
-  .small_input {
-    width: 508px;
-    height: 56px;
-    border-radius: 4px;
-  }
+.form_label {
+  font-size: 12px;
+  color: var(--ifm-text-color);
+  background-color: var(--ifm-background-color);
+}
+.small_input {
+  width: 508px;
+  height: 56px;
+  border-radius: 4px;
+}
 
-  .large_input {
-    width: 508px;
-    height: 220px;
-    border-radius: 4px;
-  }
-}
\ No newline at end of file
+.large_input {
+  width: 508px;
+  height: 220px;
+  border-radius: 4px;
+}
diff --git a/src/components/home/AboutQS/styles.module.css b/src/components/home/AboutQS/styles.module.css
index ae8e3c836..68dd29c96 100644
--- a/src/components/home/AboutQS/styles.module.css
+++ b/src/components/home/AboutQS/styles.module.css
@@ -7,22 +7,9 @@ div .text_container {
   color: var(--ifm-text-color-about-qs-banner);
 }
 
-@media only screen and (max-width: 996px) {
-  /* Mobile */
-  .text_container {
-    font-size: 14px;
-    text-align: center;
-    margin-bottom: var(--ifm-spacing-lg);
-    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-2xl);
-  }
-}
-
-@media only screen and (min-width: 996px) {
-  /* Desktop */
-  .text_container {
-    font-size: 24px;
-    text-align: center;
-    margin-bottom: var(--ifm-spacing-lg);
-    padding: var(--ifm-spacing-5xl) var(--ifm-spacing-5xl);
-  }
+.text_container {
+  font-size: 20px;
+  text-align: center;
+  margin-bottom: var(--ifm-spacing-lg);
+  padding: var(--ifm-spacing-5xl) var(--ifm-spacing-5xl);
 }
diff --git a/src/components/home/Hero/styles.module.css b/src/components/home/Hero/styles.module.css
index 199ee5187..f80b23b63 100644
--- a/src/components/home/Hero/styles.module.css
+++ b/src/components/home/Hero/styles.module.css
@@ -1,58 +1,37 @@
 @media only screen and (max-width: 996px) {
   /*Mobile*/
-  .hero_container {
-    margin: var(--ifm-spacing-xl) var(--ifm-spacing-xl) 0 var(--ifm-spacing-xl);
-  }
-
-  .h2_custom {
-    color: var(--ifm-color-secondary-s2);
-    text-align: center;
-    margin: 0;
-  }
-
   .logos_carousel {
     display: none;
   }
-
-  .subheader {
-    text-align: center;
-  }
-
-  .astronaut_container {
-    width: 150px
-  }
 }
 
-@media only screen and (min-width: 996px) {
-  /* Desktop */
-  .hero_container {
-    margin: var(--ifm-spacing-5xl) 0 var(--ifm-spacing-xl) 0;
-  }
+.hero_container {
+  margin: var(--ifm-spacing-5xl) 0 var(--ifm-spacing-xl) 0;
+}
 
-  .table_with_8_customers {
-    margin-bottom: var(--ifm-spacing-xl);
-  }
+.table_with_8_customers {
+  margin-bottom: var(--ifm-spacing-xl);
+}
 
-  .customer_logo {
-    filter: grayscale(1);
-    width: 100px;
-  }
+.customer_logo {
+  filter: grayscale(1);
+  width: 100px;
+}
 
-  .worked_with {
-    font-size: var(--ifm-font-size-normal);
-    color: var(--ifm-color_neutral-n1);
-    text-align: center;
-    margin: var(--ifm-spacing-2xl) 0;
-  }
+.worked_with {
+  font-size: var(--ifm-font-size-normal);
+  color: var(--ifm-color_neutral-n1);
+  text-align: center;
+  margin: var(--ifm-spacing-2xl) 0;
+}
 
-  .h2_custom {
-    color: var(--ifm-color-secondary-s2);
-  }
+.h2_custom {
+  color: var(--ifm-color-secondary-s2);
+}
 
-  .sub_header {
-    text-align: left;
-  }
-  .astronaut_container {
-    width: 300px
-  }
+.sub_header {
+  text-align: left;
+}
+.astronaut_container {
+  width: 300px;
 }
diff --git a/src/components/home/LearnMore/styles.module.css b/src/components/home/LearnMore/styles.module.css
index a16f482f3..6c389b41d 100644
--- a/src/components/home/LearnMore/styles.module.css
+++ b/src/components/home/LearnMore/styles.module.css
@@ -9,37 +9,16 @@ div .learn_more_title {
 .learn_more_container {
   background-color: var(--ifm-background-color-blue-banner);
   text-align: center;
-  padding: var(--ifm-spacing-2xl)
+  padding: var(--ifm-spacing-2xl);
 }
 
-
-@media only screen and (max-width: 996px) {
-  /*Mobile */
-  .learn_more_text {
-    text-align: center;
-    font-family: var(--ifm-font-family-roboto);
-    font-size: 14x;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 36px; /* 128.571% */
-    padding: var(--ifm-spacing-lg);
-    color: var(--ifm-text-color-blue-banner);
-  }
-  
-}
-
-@media only screen and (min-width: 996px) {
-  /*Desktop */
-  .learn_more_text {
-    text-align: center;
-    font-family: var(--ifm-font-family-roboto);
-    font-size: 28px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 36px; /* 128.571% */
-    padding: var(--ifm-spacing-2xl);
-    color: var(--ifm-text-color-blue-banner);
-  }
-  
-
+.learn_more_text {
+  text-align: center;
+  font-family: var(--ifm-font-family-roboto);
+  font-size: 20px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 36px; /* 128.571% */
+  padding: var(--ifm-spacing-2xl);
+  color: var(--ifm-text-color-blue-banner);
 }
diff --git a/src/components/home/News/styles.module.css b/src/components/home/News/styles.module.css
index cb5c9c61c..f3ff14725 100644
--- a/src/components/home/News/styles.module.css
+++ b/src/components/home/News/styles.module.css
@@ -3,23 +3,17 @@
   .news_container {
     display: none;
   }
-
 }
 
-@media only screen and (min-width: 996px) {
-  /*Desktop */
-  .news_container {
-    margin: var(--ifm-spacing-5xl) 0 var(--ifm-spacing-2xl) 0 ;
-  }
-
-  .blog_button {
-    background-color: var(--ifm-color-orange-jupyter);
-  }
+.news_container {
+  margin: var(--ifm-spacing-5xl) 0 var(--ifm-spacing-2xl) 0;
+}
 
-  .h2_custom {
-    text-align: center;
-    margin-bottom: var(--ifm-spacing-2xl)
-  }
-  
+.blog_button {
+  background-color: var(--ifm-color-orange-jupyter);
+}
 
+.h2_custom {
+  text-align: center;
+  margin-bottom: var(--ifm-spacing-2xl);
 }
diff --git a/src/components/home/ProjectsOverview/Robotics copy.tsx b/src/components/home/ProjectsOverview/Robotics copy.tsx
new file mode 100644
index 000000000..3cb39e8a5
--- /dev/null
+++ b/src/components/home/ProjectsOverview/Robotics copy.tsx	
@@ -0,0 +1,30 @@
+import styles from "./styles.module.css";
+import RoboticsMD from "@site/src/components/home/ProjectsOverview/descriptions/Robotics.md";
+import RoboticsPictureUrl from "@site/static/img/projects/robotics.png";
+
+export default function RoboticsProjects() {
+  return (
+    <div className={"container" + " " + styles.project_container}>
+      <div className={"row"}>
+        <div
+          className={
+            "col col--5 col--offset-1" +
+            " " +
+            "flex-full-centered" +
+            " " +
+            styles.col_project_overview_with_padding
+          }
+        >
+          <img src={RoboticsPictureUrl} width={"640px"} alt={"Picture showing two jupyterlab user interfaces displaying robotics projects."}/>
+        </div>
+        <div className={"col col--5" + " " + styles.col_project_overview_with_padding}>
+          <h1 className="padding-none">Robotics </h1>
+          <h2 className={styles.h2_custom}>
+            We just kicked off a new initiative to Robotics education.
+          </h2>
+          <RoboticsMD />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/home/ProjectsOverview/Robotics.tsx b/src/components/home/ProjectsOverview/Robotics.tsx
index 3cb39e8a5..9cfe38eb1 100644
--- a/src/components/home/ProjectsOverview/Robotics.tsx
+++ b/src/components/home/ProjectsOverview/Robotics.tsx
@@ -8,22 +8,32 @@ export default function RoboticsProjects() {
       <div className={"row"}>
         <div
           className={
-            "col col--5 col--offset-1" +
-            " " +
-            "flex-full-centered" +
-            " " +
-            styles.col_project_overview_with_padding
+            "col col--5" + " " + styles.col_project_overview_with_padding
           }
         >
-          <img src={RoboticsPictureUrl} width={"640px"} alt={"Picture showing two jupyterlab user interfaces displaying robotics projects."}/>
-        </div>
-        <div className={"col col--5" + " " + styles.col_project_overview_with_padding}>
           <h1 className="padding-none">Robotics </h1>
           <h2 className={styles.h2_custom}>
             We just kicked off a new initiative to Robotics education.
           </h2>
           <RoboticsMD />
         </div>
+        <div
+          className={
+            "col col--5 col--offset-1" +
+            " " +
+            "flex-full-centered" +
+            " " +
+            styles.col_project_overview_with_padding
+          }
+        >
+          <img
+            src={RoboticsPictureUrl}
+            width={"640px"}
+            alt={
+              "Picture showing two jupyterlab user interfaces displaying robotics projects."
+            }
+          />
+        </div>
       </div>
     </div>
   );
diff --git a/src/components/home/ProjectsOverview/SupplyChain.tsx b/src/components/home/ProjectsOverview/SupplyChain.tsx
index 91da55339..e2fa27227 100644
--- a/src/components/home/ProjectsOverview/SupplyChain.tsx
+++ b/src/components/home/ProjectsOverview/SupplyChain.tsx
@@ -6,17 +6,7 @@ export default function SupplyChainProjects() {
   return (
     <div className={"container" + " " + styles.project_container}>
       <div className={"row"}>
-        <div
-          className={
-            "col col--5 col--offset-1" +
-            " " +
-            "flex-full-centered" +
-            " " +
-            styles.col_project_overview_with_padding
-          }
-        >
-          <img src={MambaPictureUrl} width={"486px"} alt={"Picture showing a terminal in which mamba commands are run."} />
-        </div>
+        
         <div
           className={
             "col col--5" + " " + styles.col_project_overview_with_padding
@@ -29,6 +19,17 @@ export default function SupplyChainProjects() {
           <div className="spacing-2xl"></div>
           <SupplyChainMD />
         </div>
+        <div
+          className={
+            "col col--5 col--offset-1" +
+            " " +
+            "flex-full-centered" +
+            " " +
+            styles.col_project_overview_with_padding
+          }
+        >
+          <img src={MambaPictureUrl} width={"486px"} alt={"Picture showing a terminal in which mamba commands are run."} />
+        </div>
       </div>
     </div>
   );
diff --git a/src/components/home/ProjectsOverview/SupplyChainReversed.tsx b/src/components/home/ProjectsOverview/SupplyChainReversed.tsx
new file mode 100644
index 000000000..91da55339
--- /dev/null
+++ b/src/components/home/ProjectsOverview/SupplyChainReversed.tsx
@@ -0,0 +1,35 @@
+import styles from "./styles.module.css";
+import SupplyChainMD from "./descriptions/SupplyChain.md";
+import MambaPictureUrl from "@site/static/img/projects/mamba_console.png";
+
+export default function SupplyChainProjects() {
+  return (
+    <div className={"container" + " " + styles.project_container}>
+      <div className={"row"}>
+        <div
+          className={
+            "col col--5 col--offset-1" +
+            " " +
+            "flex-full-centered" +
+            " " +
+            styles.col_project_overview_with_padding
+          }
+        >
+          <img src={MambaPictureUrl} width={"486px"} alt={"Picture showing a terminal in which mamba commands are run."} />
+        </div>
+        <div
+          className={
+            "col col--5" + " " + styles.col_project_overview_with_padding
+          }
+        >
+          <h1 className="padding-none">Software supply chain </h1>
+          <h2 className={styles.h2_custom}>
+            We are the main organisation supporting the mamba package manager.
+          </h2>
+          <div className="spacing-2xl"></div>
+          <SupplyChainMD />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/home/ProjectsOverview/styles.module.css b/src/components/home/ProjectsOverview/styles.module.css
index 5ca84bee7..73f596907 100644
--- a/src/components/home/ProjectsOverview/styles.module.css
+++ b/src/components/home/ProjectsOverview/styles.module.css
@@ -1,25 +1,11 @@
-@media only screen and (max-width: 996px) {
-  /*Mobile */
-  .row_custom {
-    flex-direction: column-reverse;
-  }
-
-  .project_desktop {
-    display: none;
-  }
+.project_desktop {
+  margin-bottom: var(--ifm-spacing-3xl);
 }
 
-@media only screen and (min-width: 996px) {
-  /*Desktop */
-  .project_desktop {
-    margin-bottom: var(--ifm-spacing-3xl);
-  }
-
-  .h2_custom {
-    color: var(--ifm-color-secondary-s2);
-  }
+.h2_custom {
+  color: var(--ifm-color-secondary-s2);
+}
 
-  .col_project_overview_with_padding {
-    padding: var(--ifm-spacing-4xl) var(--ifm-spacing-3xl);
-  }
+.col_project_overview_with_padding {
+  padding: var(--ifm-spacing-4xl) var(--ifm-spacing-3xl);
 }
diff --git a/src/components/home/WhatWeDo/styles.module.css b/src/components/home/WhatWeDo/styles.module.css
index 8033e4cea..c532004b0 100644
--- a/src/components/home/WhatWeDo/styles.module.css
+++ b/src/components/home/WhatWeDo/styles.module.css
@@ -1,5 +1,11 @@
-.topics_header {
+@media only screen and (max-width: 996px) {
+  /*Mobile*/
+  .header {
+    display: none;
+  }
+}
 
+.topics_header {
   font-family: var(--ifm-font-family-rubik-one);
   font-size: var(--ifm-font-size-secondary-title);
   font-style: normal;
@@ -13,68 +19,21 @@ div .topics_header {
   color: var(--ifm-text-color-topics-card);
 }
 
-.topics_text {
-  text-align: center;
-  font-family: var(--ifm-font-family-roboto);
-  font-size: 6px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 20px; /* 142.857% */
-  letter-spacing: 0.25px;
+.header {
+  color: var(--ifm-text-color-on-primary-p1);
 }
-
-.topics_text p {
-  color: var(--ifm-text-color-topics-card);
+.whatwedo_container {
+  background-color: var(--ifm-color-primary-p1);
+  padding: var(--ifm-spacing-2xl);
+  margin-top: var(--ifm-spacing-5xl);
 }
 
-@media only screen and (max-width: 996px) {
-  /*Mobile*/
-  .header {
-    display: none;
-  }
-
-  .link_to_services_desktop {
-    display: none;
-  }
-
-  .topics_card {
-    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-lg);
-    border: none;
-    border-radius: 0;
-    border: transparent;;
-  }
-
-  .topics_card_yellow {
-    background-color: var(--ifm-background-color-topics-card-yellow);
-    color: var(--ifm-text-color-topics-card-yellow);
-  }
-
-  .topics_card_white {
-    background-color: var(--ifm-background-color-topics-card-white);
-    color: var(--ifm-text-color-topics-card-white);
-  }
-}
-
-@media only screen and (min-width: 996px) {
-  /* Desktop */
-
-  .header {
-    color: var(--ifm-text-color-on-primary-p1)
-  }
-  .whatwedo_container {
-    background-color: var(--ifm-color-primary-p1);
-    padding: var(--ifm-spacing-2xl);
-    margin-top: var(--ifm-spacing-5xl);
-  }
-
-
-  .topics_card {
-    height: 462px;
-    width: 350px;
-    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-lg);
-    border-radius: 8px;
-    box-shadow: 0px 0px 8px 1px #c8c8c7;
-    background-color: var(--ifm-background-color-topics-card);
-    margin-bottom: var(--ifm-spacing-2xl);
-  }
+.topics_card {
+  height: 462px;
+  width: 350px;
+  padding: var(--ifm-spacing-2xl) var(--ifm-spacing-lg);
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 1px #c8c8c7;
+  background-color: var(--ifm-background-color-topics-card);
+  margin-bottom: var(--ifm-spacing-2xl);
 }
diff --git a/src/components/projects/ProjectCard.tsx b/src/components/projects/ProjectCard.tsx
index 1a618f223..028aaad9e 100644
--- a/src/components/projects/ProjectCard.tsx
+++ b/src/components/projects/ProjectCard.tsx
@@ -4,7 +4,7 @@ export default function ProjectCard({ project }): JSX.Element {
   /*if (project.reverse === "false") {*/
     return (
       <div className={"container" + " " + styles.project_container}>
-        <div className={"row" + " " + "horizontally-centered"}>
+        <div className={"row row--no-gutters" + " " + "horizontally-centered"}>
           <div className={"col col--6" + " " + styles.col_project_text}>
             <div className={styles.project_title}>{project.title}</div>
             <div className={styles.project_description}>
diff --git a/src/components/projects/styles.module copy.css b/src/components/projects/styles.module copy.css
new file mode 100644
index 000000000..1d744ae29
--- /dev/null
+++ b/src/components/projects/styles.module copy.css	
@@ -0,0 +1,199 @@
+.h1_custom {
+  padding: 0;
+}
+
+div .schedule_container {
+  background-color: var(--ifm-background-color-blue-banner);
+}
+
+/*@media only screen and (max-width: 480px) {
+  /*Mobile */
+  .project_container {
+    padding: var(--ifm-spacing-sm) var(--ifm-spacing-lg);
+    margin-bottom: var(--ifm-spacing-xs);
+    width: 200px;
+    height: 100px;
+    background-color: var(--ifm-background-color-project-card);
+  }
+
+  .header_text {
+    font-family: var(--ifm-font-family-roboto);
+    color: var(--ifm-text-color-project-card);
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 20px; 
+    letter-spacing: 0.25px;
+    text-align: center;
+    padding: 0 var(--ifm-spacing-lg);
+  }
+
+  .project_title_small {
+    margin-top: var(--ifm-spacing-md);
+    color: var(--ifm-color-neutral-n1);
+    font-family: var(--ifm-font-family-roboto);
+    font-size: var(--ifm-font-size-normal);
+    font-style: normal;
+    font-weight: 400;
+    line-height: 24px; 
+    letter-spacing: 0.5px;
+    width: 150px;
+    text-align: center;
+  }
+
+  .header_container {
+    padding: var(--ifm-spacing-lg) 0;
+    background-color: var(--ifm-color-primary-p1);
+  }
+
+  .ul.row.row_all_projects {
+    padding-left: 0;
+  }
+
+  .schedule_container {
+    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-3xl);
+  }
+
+  .schedule_text {
+    font-family: var(--ifm-font-family-roboto);
+    color: var(--ifm-text-color-blue-banner);
+    font-size: 14px;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 500;
+    line-height: 20px; 
+    letter-spacing: 0.1px;
+    text-align: center;
+    margin-bottom: var(--ifm-spacing-2xl);
+  }
+
+  .project_image_container {
+    padding: var(--ifm-spacing-xl) 0;
+    text-align: center;
+  }
+
+  .project_title_popup {
+    padding: 8px 32px 8px 20px;
+    text-align: left;
+    color: var(--ifm-text-color);
+    font-family: var(--ifm-font-family-bebas-neue);
+    font-size: 24px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 150%; 
+    letter-spacing: 1.056px;
+    height: 52px;
+  }
+
+  .project_description_container {
+    padding: var(--ifm-spacing-xl) var(--ifm-spacing-3xl);
+  }
+/*}
+
+/*@media only screen and (min-width: 996px) {
+  /*Desktop */
+  .project_container {
+    margin-bottom: var(--ifm-spacing-lg);
+    margin-left: 0;
+    padding: 0;
+    /*background-color: var(--ifm-background-color-project-card);*/
+    /*border-radius: 10px;
+    box-shadow: 0px 0px 8px 1px #d0cb54;*/
+  }
+
+  .project_title {
+    margin-bottom: var(--ifm-spacing-md);
+    font-family: var(--ifm-font-family-bebas-neue);
+    font-size: var(--ifm-font-size-secondary-title);
+    font-style: normal;
+    font-weight: bolder;
+    line-height: 150%;
+    text-align: start;
+  }
+
+  div .project_title {
+    color: var(--ifm-text-color-project-card);
+  }
+
+  .project_description {
+    /*padding: var(--ifm-spacing-md) var(--ifm-spacing-xl);*/
+    text-align: center;
+  }
+
+  .project_description p {
+    color: var(--ifm-text-color-project-card);
+  }
+
+  /*.row_project {
+    background-color: var(--ifm-background-color-project-card);
+    border-radius: 10px;
+    box-shadow: 0px 0px 8px 1px #d0cb54;
+    width: 1200px;
+  }*/
+
+  .col_project_text {
+    background-color: var(--ifm-background-color-project-card);
+    padding: var(--ifm-spacing-4xl) var(--ifm-spacing-3xl);
+    border-radius: 10px;
+    /*box-shadow: 0px 0px 8px 1px #d0cb54;*/
+  }
+
+  .col_project_picture_left {
+    margin-right: var(--ifm-spacing-lg);
+    border-radius: 10px;
+  }
+
+  .col_project_picture_right {
+    margin-left: var(--ifm-spacing-lg);
+    border-radius: 10px;
+  }
+
+  .col_schedule {
+    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-2xl);
+    margin: 0;
+    max-width: none;
+  }
+
+  .header_text {
+    font-family: var(--ifm-font-family-roboto);
+    color: var(--ifm-text-color-project-card);
+    font-size: 22px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 28px; /* 142.857% */
+    text-align: center;
+    margin-bottom: var(--ifm-spacing-6xl);
+  }
+
+  .header_container {
+    margin-top: var(--ifm-spacing-6xl);
+    padding: 0;
+  }
+
+  .schedule_text {
+    font-family: var(--ifm-font-family-bebas-neue);
+    font-size: var(--ifm-font-size-secondary-title);
+    font-style: normal;
+    font-weight: 800;
+    line-height: 150%;
+    text-align: center;
+    margin-bottom: var(--ifm-spacing-2xl);
+  }
+
+  div .schedule_text {
+    color: var(--ifm-text-color-blue-banner);
+  }
+
+  .link_to_button_custom {
+    margin: var(--ifm-spacing-lg) 0;
+  }
+
+  .schedule_a_meeting_container {
+    margin-top: var(--ifm-spacing-7xl);
+  }
+
+  .all_projects_desktop_container {
+    margin-left: var(--ifm-spacing-6xl);
+    margin-right: var(--ifm-spacing-6xl);
+  }
+/*}
diff --git a/src/components/projects/styles.module.css b/src/components/projects/styles.module.css
index 0dfbc4fea..39c4bad97 100644
--- a/src/components/projects/styles.module.css
+++ b/src/components/projects/styles.module.css
@@ -6,195 +6,106 @@ div .schedule_container {
   background-color: var(--ifm-background-color-blue-banner);
 }
 
-/*@media only screen and (max-width: 996px) {
-  /*Mobile */
-  /*.project_container {
-    padding: var(--ifm-spacing-sm) var(--ifm-spacing-lg);
-    margin-bottom: var(--ifm-spacing-xs);
-    width: 200px;
-    height: 100px;
-    background-color: var(--ifm-background-color-project-card);
-  }
-
-  .header_text {
-    font-family: var(--ifm-font-family-roboto);
-    color: var(--ifm-text-color-project-card);
-    font-size: 14px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 20px; 
-    letter-spacing: 0.25px;
-    text-align: center;
-    padding: 0 var(--ifm-spacing-lg);
-  }
-
-  .project_title_small {
-    margin-top: var(--ifm-spacing-md);
-    color: var(--ifm-color-neutral-n1);
-    font-family: var(--ifm-font-family-roboto);
-    font-size: var(--ifm-font-size-normal);
-    font-style: normal;
-    font-weight: 400;
-    line-height: 24px; 
-    letter-spacing: 0.5px;
-    width: 150px;
-    text-align: center;
-  }
-
-  .header_container {
-    padding: var(--ifm-spacing-lg) 0;
-    background-color: var(--ifm-color-primary-p1);
-  }
-
-  .ul.row.row_all_projects {
-    padding-left: 0;
-  }
-
-  .schedule_container {
-    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-3xl);
-  }
-
-  .schedule_text {
-    font-family: var(--ifm-font-family-roboto);
-    color: var(--ifm-text-color-blue-banner);
-    font-size: 14px;
-    font-family: Roboto;
-    font-size: 14px;
-    font-style: normal;
-    font-weight: 500;
-    line-height: 20px; 
-    letter-spacing: 0.1px;
-    text-align: center;
-    margin-bottom: var(--ifm-spacing-2xl);
-  }
-
-  .project_image_container {
-    padding: var(--ifm-spacing-xl) 0;
-    text-align: center;
-  }
-
-  .project_title_popup {
-    padding: 8px 32px 8px 20px;
-    text-align: left;
-    color: var(--ifm-text-color);
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: 24px;
-    font-style: normal;
-    font-weight: 600;
-    line-height: 150%; 
-    letter-spacing: 1.056px;
-    height: 52px;
-  }
-
-  .project_description_container {
-    padding: var(--ifm-spacing-xl) var(--ifm-spacing-3xl);
-  }
-}*/
-
-/*@media only screen and (min-width: 996px) {
-  /*Desktop */
-  .project_container {
-    margin-bottom: var(--ifm-spacing-lg);
-    margin-left: 0;
-    padding: 0;
-    /*background-color: var(--ifm-background-color-project-card);*/
-    /*border-radius: 10px;
-    box-shadow: 0px 0px 8px 1px #d0cb54;*/
-  }
-
-  .project_title {
-    margin-bottom: var(--ifm-spacing-md);
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: var(--ifm-font-size-secondary-title);
-    font-style: normal;
-    font-weight: bolder;
-    line-height: 150%;
-    text-align: start;
-  }
-
-  div .project_title {
-    color: var(--ifm-text-color-project-card);
-  }
-
-  .project_description {
-    /*padding: var(--ifm-spacing-md) var(--ifm-spacing-xl);*/
-    text-align: center;
-  }
-
-  .project_description p {
-    color: var(--ifm-text-color-project-card);
-  }
-
-  /*.row_project {
+.project_container {
+  margin-bottom: var(--ifm-spacing-lg);
+  margin-left: 0;
+  padding: 0;
+}
+
+.project_title {
+  margin-bottom: var(--ifm-spacing-md);
+  font-family: var(--ifm-font-family-bebas-neue);
+  font-size: var(--ifm-font-size-secondary-title);
+  font-style: normal;
+  font-weight: bolder;
+  line-height: 150%;
+  text-align: start;
+}
+
+div .project_title {
+  color: var(--ifm-text-color-project-card);
+  padding-left: var(--ifm-spacing-xl);
+}
+
+.project_description {
+  padding: var(--ifm-spacing-md) var(--ifm-spacing-xl);
+  text-align: center;
+}
+
+.project_description p {
+  color: var(--ifm-text-color-project-card);
+}
+
+/*.row_project {
     background-color: var(--ifm-background-color-project-card);
     border-radius: 10px;
     box-shadow: 0px 0px 8px 1px #d0cb54;
     width: 1200px;
   }*/
 
-  .col_project_text {
-    background-color: var(--ifm-background-color-project-card);
-    padding: var(--ifm-spacing-4xl) var(--ifm-spacing-3xl);
-    border-radius: 10px;
-    /*box-shadow: 0px 0px 8px 1px #d0cb54;*/
-  }
+.col_project_text {
+  /* background-color: var(--ifm-background-color-project-card);*/
+  background-color: red;
+  padding: var(--ifm-spacing-4xl) var(--ifm-spacing-3xl);
+  border-radius: 10px;
+  /*box-shadow: 0px 0px 8px 1px #d0cb54;*/
+}
 
-  .col_project_picture_left {
-    margin-right: var(--ifm-spacing-lg);
-    border-radius: 10px;
-  }
+.col_project_picture_left {
+  margin: none;
+  border-radius: 10px;
+}
 
-  .col_project_picture_right {
-    margin-left: var(--ifm-spacing-lg);
-    border-radius: 10px;
-  }
-
-  .col_schedule {
-    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-2xl);
-    margin: 0;
-    max-width: none;
-  }
-
-  .header_text {
-    font-family: var(--ifm-font-family-roboto);
-    color: var(--ifm-text-color-project-card);
-    font-size: 22px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 28px; /* 142.857% */
-    text-align: center;
-    margin-bottom: var(--ifm-spacing-6xl);
-  }
-
-  .header_container {
-    margin-top: var(--ifm-spacing-6xl);
-    padding: 0;
-  }
-
-  .schedule_text {
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: var(--ifm-font-size-secondary-title);
-    font-style: normal;
-    font-weight: 800;
-    line-height: 150%;
-    text-align: center;
-    margin-bottom: var(--ifm-spacing-2xl);
-  }
-
-  div .schedule_text {
-    color: var(--ifm-text-color-blue-banner);
-  }
-
-  .link_to_button_custom {
-    margin: var(--ifm-spacing-lg) 0;
-  }
-
-  .schedule_a_meeting_container {
-    margin-top: var(--ifm-spacing-7xl);
-  }
-
-  .all_projects_desktop_container {
-    margin-left: var(--ifm-spacing-6xl);
-    margin-right: var(--ifm-spacing-6xl);
-  }
-/*}*/
+.col_project_picture_right {
+  margin-left: var(--ifm-spacing-lg);
+  border-radius: 10px;
+}
+
+.col_schedule {
+  padding: var(--ifm-spacing-2xl) var(--ifm-spacing-2xl);
+  margin: 0;
+  max-width: none;
+}
+
+.header_text {
+  font-family: var(--ifm-font-family-roboto);
+  color: var(--ifm-text-color-project-card);
+  font-size: 22px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 28px; /* 142.857% */
+  text-align: center;
+  margin-bottom: var(--ifm-spacing-6xl);
+}
+
+.header_container {
+  margin-top: var(--ifm-spacing-6xl);
+  padding: 0;
+}
+
+.schedule_text {
+  font-family: var(--ifm-font-family-bebas-neue);
+  font-size: var(--ifm-font-size-secondary-title);
+  font-style: normal;
+  font-weight: 800;
+  line-height: 150%;
+  text-align: center;
+  margin-bottom: var(--ifm-spacing-2xl);
+}
+
+div .schedule_text {
+  color: var(--ifm-text-color-blue-banner);
+}
+
+.link_to_button_custom {
+  margin: var(--ifm-spacing-lg) 0;
+}
+
+.schedule_a_meeting_container {
+  margin-top: var(--ifm-spacing-7xl);
+}
+
+.all_projects_desktop_container {
+  margin-left: var(--ifm-spacing-6xl);
+  margin-right: var(--ifm-spacing-6xl);
+}
diff --git a/src/components/services/styles.module.css b/src/components/services/styles.module.css
index 310fea811..0cf6fe9de 100644
--- a/src/components/services/styles.module.css
+++ b/src/components/services/styles.module.css
@@ -1,46 +1,4 @@
-@media only screen and (max-width: 996px) {
-  /*Mobile */
-  .services_header_text {
-    padding: var(--ifm-spacing-xl) var(--ifm-spacing-2xl);
-  }
-
-  .services_title {
-    margin-top: var(--ifm-spacing-xl);
-  }
-
-  .services_description {
-    padding: 0 var(--ifm-spacing-2xl);
-  }
-
-  .transition {
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: 24px;
-    font-style: normal;
-    font-weight: bolder;
-    line-height: 150%;
-    letter-spacing: 1.056px;
-    color: var(--ifm-color-indigo-i1);
-    text-align: center;
-    padding: var(--ifm-spacing-xl) var(--ifm-spacing-2xl);
-  }
-
-  .sign_a_support_container {
-    font-family: var(--ifm-font-family-roboto);
-    font-size: 14px;
-    text-align: center;
-    background-color: var(--ifm-background-color-blue-banner);
-    color: var(--ifm-text-color-blue-banner);
-    padding: var(--ifm-spacing-2xl) var(--ifm-spacing-2xl);
-  }
-
-  .sign_a_support_text {
-    margin-bottom: var(--ifm-spacing-2xl);
-    color: var(---ifm-text-color-blue-banner);
-  }
-}
 
-@media only screen and (min-width: 996px) {
-  /*Desktop */
   .service_container {
     margin-top: var(--ifm-spacing-6xl);
   }
@@ -81,4 +39,3 @@
     margin-top: var(--ifm-spacing-4xl);
     color: var(--ifm-text-color-services-transition);
   }
-}
diff --git a/src/css/custom.css b/src/css/custom.css
index c718fd0a4..63601e09a 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -27,7 +27,7 @@
 
   --ifm-text-color: var(--ifm-color-primary-p2);
   --ifm-text-color-main-title: var(--ifm-color-primary-p2);
-  --ifm-background-color-value-card-yellow:var(--ifm-color-primary-p1);
+  --ifm-background-color-value-card-yellow: var(--ifm-color-primary-p1);
   --ifm-background-color: white;
   --ifm-background-color-value-card-white: white;
   --ifm-text-color-value-card-white: var(--ifm-color-primary-p2);
@@ -45,7 +45,7 @@
   --ifm-text-color-project-card: var(--ifm-color-primary-p2);
   --ifm-color-text-on-primary-p1: var(--ifm-color-primary-p2);
   --ifm-text-color-services-transition: var(--ifm-color-indigo-i1);
-  --ifm-background-color-blue-banner:var(--ifm-color-secondary-s1);
+  --ifm-background-color-blue-banner: var(--ifm-color-secondary-s1);
   --ifm-text-color-blue-banner: var(--ifm-color-secondary-s3);
   --ifm-background-color-about-qs-banner: var(--ifm-color-primary-p1);
   --ifm-text-color-about-qs-banner: var(--ifm-color-primary-p2);
@@ -56,13 +56,13 @@
 
   /* buttons */
   --ifm-background-color-button-home: var(--ifm-color-orange-jupyter);
-  --ifm-text-color-button-home: var( --ifm-color-primary-p3);
+  --ifm-text-color-button-home: var(--ifm-color-primary-p3);
   --ifm-background-color-button-blue-banner: var(--ifm-color-secondary-s3);
   --ifm-text-color-button-blue-banner: white;
   --ifm-color-blue-contact-send-button: var(--ifm-color-blue-jupyter);
   --ifm-background-color-popup-overlay: grey;
 
-/* Font sizes */
+  /* Font sizes */
   --ifm-font-size-small: 14px;
   --ifm-font-size-normal: 18px;
   --ifm-font-size-medium: 24px;
@@ -137,137 +137,48 @@ ul {
   padding-left: 0;
 }
 
-@media only screen and (max-width: 996px) {
-  /*Mobile */
-  .main-container-with-margins {
-    margin: 0;
-    display: flex;
-    justify-content: center;
-  }
-
-  h1 {
-    color: var(--ifm-text-color-main-title);
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: 24px;
-    font-style: normal;
-    font-weight: 600;
-    line-height: 150%; /* 36px */
-    letter-spacing: 1.056px;
-    text-align: center;
-    padding: 0;
-  }
-
-  h2 {
-    color: var(--ifm-text-color-main-title);
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: 24px;
-    font-style: normal;
-    font-weight: 600;
-    line-height: 150%; /* 36px */
-    letter-spacing: 1.056px;
-    text-align: center;
-    padding: 0;
-  }
-
-  h3 {
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: 24px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 150%; /* 36px */
-    letter-spacing: 1.056px;
-    text-align: center;
-  }
-
-  p {
-    font-family: var(--ifm-font-family-roboto);
-    font-size: 14px;
-    /* color: var(--ifm-color-primary-p3);*/
-    font-style: normal;
-    line-height: 150%;
-    line-height: 20px; /* 142.857% */
-    letter-spacing: 0.25px;
-    text-align: justify;
-  }
-
-  li {
-    font-size: 14px;
-  }
-  .header-page-mobile {
-    height: 64px;
-  }
+.main-container-with-margins {
+  margin-left: 96px;
+  margin-right: 96px;
+  display: flex;
+  justify-content: center;
 }
 
-@media only screen and (min-width: 996px) {
-  /*Desktop */
-  .main-container-with-margins {
-    margin-left: 96px;
-    margin-right: 96px;
-    display: flex;
-    justify-content: center;
-  }
-
-  .main-container-with-larger-margins {
-    margin-left: 288px;
-    margin-right: 288px;
-    display: flex;
-    justify-content: center;
-  }
-
-  h1 {
-    color: var(--ifm-text-color-main-title);
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: var(--ifm-font-size-main-title);
-    font-style: normal;
-    font-weight: 800;
-    line-height: 150%;
-    letter-spacing: 2.112px;
-    text-align: start;
-    padding: 8px 36px 8px 20px;
-  }
-
-  h2 {
-    font-family: var(--ifm-font-family-bebas-neue);
-    font-size: var(--ifm-font-size-secondary-title);
-    font-style: normal;
-    font-weight: bolder;
-    line-height: 150%;
-    text-align: start;
-  }
+h1 {
+  color: var(--ifm-text-color-main-title);
+  font-family: var(--ifm-font-family-bebas-neue);
+  font-size: var(--ifm-font-size-main-title);
+  font-style: normal;
+  font-weight: 800;
+  line-height: 150%;
+  letter-spacing: 2.112px;
+  text-align: start;
+  padding: 8px 36px 8px 20px;
+}
 
-  p {
-    font-family: var(--ifm-font-family-roboto);
-    font-size: var(--ifm-font-size-normal);
-    /* color: var(--ifm-color-primary-p3);*/
-    font-style: normal;
-    line-height: 150%;
-    line-height: 20px; /* 142.857% */
-    letter-spacing: 0.25px;
-    text-align: justify;
-  }
+h2 {
+  font-family: var(--ifm-font-family-bebas-neue);
+  font-size: var(--ifm-font-size-secondary-title);
+  font-style: normal;
+  font-weight: bolder;
+  line-height: 150%;
+  text-align: start;
+}
 
-  .container {
-    max-width: none;
-    padding: 0;
-  }
+p {
+  font-family: var(--ifm-font-family-roboto);
+  font-size: var(--ifm-font-size-normal);
+  font-style: normal;
+  letter-spacing: 0.25px;
+  text-align: justify;
+}
 
-  p {
-    font-family: var(--ifm-font-family-roboto);
-    font-size: var(--ifm-font-size-normal);
-    /*color: var(--ifm-color-primary-p3);*/
-    font-style: normal;
-    line-height: 150%;
-    text-align: justify;
-  }
+.container {
+  max-width: none;
+  padding: 0;
+}
 
-  /*div {
-    color: black;
-  }*/
 
-  /* [data-theme="dark"] div {
-    color: #fff;
-  }*/
-}
 
 @media (min-width: 1440px) {
   .container {