Update style.css

static/style.css

@@ -1339,7 +1339,7 @@ footer a:hover {
 body {
     background-color: #ffffff; /* White background */
     text-align: center; /* Center-align content */
-    margin: 0; /* Remove default margin */
+	margin: 0; /* Remove default margin */
     padding: 0; /* Remove default padding */
     font-family: 'Nico Moji', sans-serif;
 }
@@ -1356,30 +1356,26 @@ h1 {
     color: #000000; /* Black color */
     margin-top: 20px; /* Add spacing from the top */
 }
-
 .dual-headings {
     display: flex; /* Use flexbox to create side-by-side headings */
     justify-content: center; /* Center the headings horizontally */
     margin-top: 20px; /* Add spacing from the top */
     font-size: 50px;
 }
-
 .dual-heading {
     flex: 1; /* Allow headings to share available space equally */
     padding: 20px; /* Add padding around each heading */
     /*border: 1px solid #000000; /* Add a border for visual separation (optional) */
 }
-
 .team-member {
-    width: 251px; /* Set the width */
-    height: 251px; /* Set the height */
+    width: 200px; /* Set the width */
+    height: 200px; /* Set the height */
     max-width: 100%; /* Ensure images don't exceed their container */
     height: auto; /* Maintain aspect ratio */
     border-radius: 50%; /* Make the image circular */
     margin: 20px; /* Add spacing around each image */
     
 }
-
 .team-member-container {
     flex-basis: calc(50% - 40px); /* Set width for 2 items per row, with spacing */
     display: flex; /* Use flexbox to control image and caption layout */
@@ -1387,7 +1383,6 @@ h1 {
     align-items: center; /* Center-align image and caption */
     margin: 20px; /* Add spacing around each image container */
 }
-
 /* Media query for adjusting font size and position */
 @media screen and (max-width: 1440px) {
     #heading {
@@ -1413,12 +1408,41 @@ h1 {
 .sub-h1 {
     background-color: #000000; /* Black strip background color */
     color: #ffffff; /* White text color */
-    padding: 2px 0; /* Add padding to top and bottom */
+    padding: 0 0; /* Add padding to top and bottom */
     font-size: 45px;
+    width: 100%;
+    font-family: 'Nico Moji', sans-serif; /* Use the Nico Moji font */
+    text-align: center;
+            
 }      
-
 .caption {
     font-family: 'Montserrat', sans-serif;
     font-size: 20px; /* Caption font size */
     margin-top: 5px; /* Adjust the spacing between image and caption */
 }
+
+.collapsible {
+    background-color: white;
+    color: white;
+    cursor: pointer;
+    width: 100%;
+    padding-left: 0%;
+    padding-right: 0%;
+    padding-bottom: 0px;
+    border: none;
+    text-align: left;
+    outline: none;
+    font-size: 15px;
+}
+
+.active, .collapsible:hover {
+    background-color: #555;
+}
+
+.content {
+    padding: 0 18px;
+    max-height: 0;
+    transition: max-height 0.2s ease-out;
+    overflow: hidden;
+    background-color: #f1f1f1;
+}