diff --git a/src/.DS_Store b/src/.DS_Store
index 6722e146b6dda95ad4d8fff939c15330d98488ef..28f14e56297ee9a2ae79ee89c64f30e8b9d3b6fb 100644
Binary files a/src/.DS_Store and b/src/.DS_Store differ
diff --git a/src/App/mediarules.css b/src/App/mediarules.css
index b460fadc3cdfa74a4c5823a7fd8e1a62aedc19cc..7b248807c0657397aac185dc8bb717a06eb73515 100644
--- a/src/App/mediarules.css
+++ b/src/App/mediarules.css
@@ -55,6 +55,27 @@
       .container-fluid {
         min-height: 100vh; 
       }
+      /***heading***/
+      .header-title{
+        min-height: 400px;
+        text-align: center;
+        align-items: center;
+        margin: auto !important;
+        padding: 0 30px;
+        font-size: 130px;
+        font-weight: 900;
+        line-height: 130px;
+      }
+      .header-container{
+        padding-top: 50px;
+        padding-bottom: 0px;
+        background-color: var(--ourbeige);
+      }
+      .base {
+        width: 100%;
+        background-color: var(--lightblue);
+        padding: 0px;
+    }
       /***footer***/
       footer {
           width: 100% !important; 
@@ -113,8 +134,8 @@
     /***Biosafty***/
     #safehead {
       background-size: contain; /* Adjust the image to fit within the container */
-      background-position: center 35%; /* Push the image down for better visibility */
-      height: 300px; /* Adjust the height for mobile screens */
+      background-position: center 25%; /* Push the image down for better visibility */
+      height: 10px; /* Adjust the height for mobile screens */
     }
     /***Description***/
     #Cystic\ Fibrosis6 h2 {
@@ -277,9 +298,9 @@ body {
     max-width: 100% !important;
     height: auto !important;
 }
-.container {
+/*.container {
     padding: 10px;
-  }
+  }*/
 
  .row{
     display: grid !important;