Update about.liquid

Author: sammarfy

_layouts/about.liquid

@@ -36,24 +36,43 @@ layout: default
     width: 100%;
     height: 100%;
   }
-
-  .full-width-logo {
-    display: block;  /* Ensure the image is treated as a block-level element */
-    margin: 0 auto;  /* Center the image horizontally */
-    width: 100%;    /* Set the image width to 100% of the screen width */
-    height: auto;    /* Maintain the aspect ratio */
+  /* Full-screen logo */
+  .full-screen-logo {
+    display: block;
+    margin: 0;
+    width: 100%;
+    height: 100vh; /* Full viewport height */
+    object-fit: cover; /* Maintain aspect ratio while covering screen */
+  }
+  /* Center-align header and content */
+  .centered-content {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    text-align: center;
+  }
+  .post-header {
+    text-align: center;
+    margin: 0 auto;
+  }
+  /* Additional styles for other sections if needed */
+  .post {
+    max-width: 900px;
+    margin: 0 auto;
+    padding: 20px;
+    box-sizing: border-box;
   }
 </style>
 
 
+<div>
+    <img src="/assets/img/lab_logo.png" alt="Lab Logo" class="full-screen-logo">
+</div>
+
 <!-- <div class="transparent-bg"> -->
 <div class="post">
   <header class="post-header">
-    <!-- Centered Lab Logo -->
-    <p align="center" style="margin: 0; padding: 0;">
-      <img src="/assets/img/lab_logo.png" alt="Lab Logo" class="full-width-logo">
-    </p>
-
     <h1 class="post-title">
       {% if site.title == 'blank' %}
         <span class="font-weight-bold">{{ site.first_name }}</span> {{ site.middle_name }}